Ad

Uncaught TypeError: _materialUi.Styles.ThemeManager Is Not A Function

- 1 answer

I have written the following code

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;

But it keeps throwing error

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

I have searched and searched the internet and many people solved it

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

but the same solutions do not work for me.

Ad

Answer

So after posting your repo, I noticed that you are using mui 0.14, and after quick research it seems you no longer need a constructor for ThemeManager - which in prior versions you did.

just define it on import:

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

From: Material-UI

Look at the example titled: 1. Using React Lifecycle Methods with Context

Ad
source: stackoverflow.com
Ad