Reactjs 主题为（）的材质ui出现错误；TypeError:对象（…）不是函数； 编辑：我安装了v1.0.0.36测试版，并从该版本复制了示例文档（看起来与我完全相同），它马上就可以工作了。不确定问题出在哪里，但感谢您的回复

我试图使用MaterialUI的withTheme来访问组件中的主题

我遵循了中的示例，该示例通过了CreateReact应用程序打包程序ok，但在浏览器中给出了错误：TypeError:Object（…）不是函数 并突出显示代码行

>17 |导出默认withTheme（）（withTheme）

我已经将示例代码简化为
withTheme（）
的最基本用法，但仍然收到此错误

withtheme.js

import React from 'react';
import { withTheme } from 'material-ui/styles';

function WithTheme() {
  
    const styles = {
        primaryText: {
            color: 'red',
        }
    };

    return (
        <h1 style={styles.primaryText}>Hello</h1>
    );
}

export default withTheme()(WithTheme);

从“React”导入React；
从“材质ui/样式”导入{withTheme}；
带有主题（）的函数{
常量样式={
primaryText：{
颜色：“红色”，
}
};
返回(
你好
);
}
导出默认withTheme（）（withTheme）；

编辑：为了帮助澄清问题，这里是App.js文件。

import React, { Component } from 'react';
import './App.css';
import 'typeface-roboto';

import AppBar from 'material-ui/AppBar';

import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import {brown500, brown900} from 'material-ui/styles/colors';
import getMuiTheme from 'material-ui/styles/getMuiTheme';

import WithTheme from './components/withtheme';

const Theme = getMuiTheme({
  palette: {
    primary1Color: brown900,
    primary2Color: brown500,
  }
});

class App extends Component {
  render() {
    return (
      <MuiThemeProvider muiTheme={Theme} >
          <AppBar
            title="Title"
            iconClassNameRight="muidocs-icon-navigation-expand-more" />
          <WithTheme />
      </MuiThemeProvider>
    );
  }
}

export default App;

import React，{Component}来自'React'；
导入“/App.css”；
输入‘字体机器人’；
从“物料ui/AppBar”导入AppBar；
从“材质ui/styles/MuiThemeProvider”导入MuiThemeProvider；
从“材质ui/样式/颜色”导入{brown500，brown900}；
从“材质ui/styles/GetMuiteme”导入GetMuiteme；
从“/components/WithTheme”导入WithTheme；
const Theme=getMuiTheme({
调色板：{
原色1：棕色900，
原色2：棕色500，
}
});
类应用程序扩展组件{
render（）{
返回(
);
}
}
导出默认应用程序；

我已经定制了主题，并使用muiThemeProvider将
primary1Color
更改为棕色。当我从App.js中删除
with theme
组件时，这一切都很好——AppBar如预期的那样是棕色的。问题是，当我尝试使用mui
with theme
函数时，出现了错误

我的意图是将
with theme
组件中的h2设置为当前主题对
primary1Color具有的任何颜色

**结束编辑

任何帮助都将不胜感激。很高兴发布doco示例代码的（几乎）精确副本，如果需要，它也会出现相同的错误

谢谢
如果您想更改material ui的主题，我更喜欢使用getMuiTheme。有关文档，请参阅。这里发生的事情是，您正在使用JavaScript设置组件的样式，因此导出需要调用withStyles

使用样式（样式）（使用主题）导出默认值
 无需使用
withStyles（）
，除非要为组件创建特定样式

使用
MuiThemeProvider
扭曲你的应用程序，你就可以正确使用主题了

材质Ui 0.20.0

对于访问主题颜色，请使用
getMuiTheme

import getMuiTheme from 'material-ui/styles/getMuiTheme';
export default muiThemeable()(App)

import { withTheme } from 'material-ui/styles';
export default withTheme()(App)



材质Ui 1.0.0测试版

对于访问主题颜色，请使用带有主题的

import getMuiTheme from 'material-ui/styles/getMuiTheme';
export default muiThemeable()(App)

import { withTheme } from 'material-ui/styles';
export default withTheme()(App)


由于MaterialUI不再是Beta版，规范有点变化，超过了Liam的答案。根据

从材料4开始，规格又发生了一点变化：（因此也超过了遮阳棚的答案）

所以现在是：

import { withTheme } from '@material-ui/styles';

export default withTheme(MyComponent);

我已经使用getMuiTheme成功地定制了主题，但我想从我自己的组件中访问主题属性，因此最终我想使用一种主题颜色来代替
颜色：“红色”
，但在尝试使用函数跟踪问题时，我将所有代码都删掉以简化。但是，我确实看到了一些示例中使用的withStyles，并且不确定withStyles和withTheme之间的区别是什么。感谢您的回复和示例。我已经更新了这个问题，因为我认为我已经正确地使用了MuiThemeProvider。我想在我自己的组件中使用主题颜色。我用两个版本的示例更新了答案，这将帮助您了解如何使用
with theme
和
getMuiTheme