Подтвердить что ты не робот

Я не могу использовать компоненты material-ui после обновления до [email protected]

Я получил это сообщение в консоли:

Несовершенные типы контекста: Обязательный контекст muiTheme не был указан в AppBar

AppBar.js: 158 Uncaught TypeError: Не удается прочитать свойство 'readyStyles' из undefined

У меня просто AppBar в моем компоненте Я думаю, он должен работать, но... вот мой очень простой код:

import React from 'react';
import {AppBar} from 'material-ui';


    export class MyComponent extends React.Component {

        render() {
            return (
                <div>
                    <AppBar
                        title="Title"
                    />

                </div>
            );
        }

    }

спасибо за помощь...

4b9b3361

Ответ 1

С [email protected] было изменено несколько вещей.

Вы можете посмотреть ссылку ниже для получения более подробной информации. https://github.com/callemall/material-ui/blob/master/CHANGELOG.md

Поэтому с этими изменениями ваш код становится:

    import React from 'react';
    import AppBar from 'material-ui/AppBar';
    import baseTheme from 'material-ui/styles/baseThemes/lightBaseTheme';
    import getMuiTheme from 'material-ui/styles/getMuiTheme';

        export class MyComponent extends React.Component {

            getChildContext() {
                return { muiTheme: getMuiTheme(baseTheme) };
            }

            render() {
                return (
                    <div>
                        <AppBar
                            title="Title"
                        />

                    </div>
                );
            }        
        }

        MyComponent.childContextTypes = {
            muiTheme: React.PropTypes.object.isRequired,
        };

Ответ 2

теперь в 0.15.0 вы можете использовать muiThemeProvider:

...

import getMuiTheme from 'material-ui/styles/getMuiTheme';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import MyAwesomeReactComponent from './MyAwesomeReactComponent';

const App = () => (
 <MuiThemeProvider muiTheme={getMuiTheme()}>
    <MyAwesomeReactComponent />
 </MuiThemeProvider>
)

...

Таким образом, вам не нужно предоставлять контекст для детского мануала. Дополнительная информация в документации.