一 :MuiThemeProvider
升级到react@15.2.1 后,使用material-ui,按照往常操作,出现了报错:
Failed Context Types: Required context muiTheme was not specified in
NavBarUncaught TypeError: Cannot read property ‘prepareStyles’ of undefined
查资料,发现material-ui的usage页面写着
Beginning with v0.15.0, Material-UI components require a theme to be
provided. The quickest way to get up and running is by using the
MuiThemeProvider to inject the theme into your application context.
就是至少需要加一个<MuiThemeProvider>
来“包住”组件。
后来代码如下,可以运行:
import React, { Component } from 'react';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; //就是它
import {Tabs, Tab} from 'material-ui/Tabs';
... ...
const NavBar = () => (
<div className="app-header">
<MuiThemeProvider> // 就是它
<Tabs tabItemContainerStyle={{ backgroundColor: 'transparent' }} style={styles.tabs} inkBarStyle={styles.inkBar}>
<Tab style={styles.tab} label="Home" />
<Tab style={styles.tab} label="Account" />
<Tab style={styles.tab} label="About" />
</Tabs>
</MuiThemeProvider> //还有它
</div>
);
export default NavBar;
二:Tabs下划线不动了
react@v15.2.1 下, 出现了tab切换,下划线不动的问题。
查阅npm提示信息,尝试将react版本换为v15.0.0
问题解决。