我有一个使用标准深色主题的主题提供商。我希望能够从我自己的自定义组件访问该主题的详细信息,但我不知道如何做到这一点。在下面的例子中,this.props.theme
未定义
ReactDOM.render(
<MuiThemeProvider theme={theme}>
<App/>
</MuiThemeProvider>, document.getElementById('root')
);
class App extends Component {
render() {
const {classes} = this.props;
return (
<div className="App">
<MainMenu/>
<div className={classes.root}>
<Grid container spacing={8}>
<Grid item xs>
<Chart theme={this.props.theme}/>
</Grid>
</Grid>
</div>
</div>
);
}
}
您还可以使用 useTheme 挂钩!
import { useTheme } from '@material-ui/styles';
function DeepChild() {
const theme = useTheme();
return <span>{`spacing ${theme.spacing}`}</span>;
}
https://material-ui.com/styles/advanced/#accessing-the-theme-in-a-component https://material-ui.com/styles/advanced/#accessing-the-theme-in-a-component
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)