Question

我写了以下代码

import React from 'react';
import mui from 'material-ui';
import injectTapEventPlugin from 'react-tap-event-plugin';
let ThemeManager = new mui.Styles.ThemeManager();
let Colors = mui.Styles.Colors;

injectTapEventPlugin();

class App extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            messages : [{id: 1, text: 'Hi'}, {id: 2, text: 'Hello'}, {id: 3, text: 'World'}, {id: 4, text: 'test'}]
        };
    }

    getChildContext() {
        return {
            stores: this.props.stores,
            muiTheme: ThemeManager.getCurrentTheme()
        };
    }

    componentWillMount() {
        ThemeManager.setPalette({
            primary1Color: Colors.blue500
        });     
    }

    render() {
        var messageNodes = this.state.messages.map((message) => {
            return (<div key={message.id}>{message.text}</div>);
        });
        return (<div>{messageNodes}</div>);
    }
}

App.childContextTypes = {
    stores: React.PropTypes.object,
    muiTheme: React.PropTypes.object
};

export default App;

但它不断抛出错误

Uncaught TypeError: _materialUi2.default.Styles.ThemeManager is not a function

我搜索并搜索了互联网，很多人解决了这个问题

https://github.com/callemall/material-ui/issues/1439

但是相同的解决方案对我不起作用。

Answer 1

所以在发布你的回购后，我注意到你正在使用mui 0.14，经过快速研究后，你似乎不再需要ThemeManager的构造函数 - 在之前的版本中你做了。

只需在导入时定义：

import ThemeManager from 'material-ui/lib/styles/theme-manager';

来自：Material-UI

查看标题为： 1的示例。将React生命周期方法与上下文一起使用

Answer 2

注意我回答这个问题的原始问题包含：

const ThemeManager = new mui.Styles.ThemeManager();

使用const而不是let。您想使用let初始化函数类。

<强>常数：

const声明创建对值的只读引用。

来自：Mozilla Docs

可让：

let语句可选地声明一个块作用域局部变量将其初始化为一个值。

来自：Mozilla Docs

根据您的转换器，您应该收到ThemeManager为只读的错误

未捕获的TypeError：_materialUi.Styles.ThemeManager不是一个函数

2 个答案: