【问题标题】:react-mounter Material-ui meteor using themesreact-mounter Material-ui 流星使用主题
【发布时间】:2016-04-22 01:44:27
【问题描述】:

我刚开始使用meteor/flow-router/react-mounter,遇到了在Material-ui中为组件设置主题的问题。

在 Material-UI v 0.15.0 中,它们不再将默认设置为 lightBaseTheme,因此必须在创建时进行设置。

这是一个示例组件。

import React from 'react';
import AppBar from 'material-ui/AppBar';
import IconButton from 'material-ui/IconButton';
import Navigationclose from 'material-ui/svg-icons/navigation/close';
import IconMenu from 'material-ui/IconMenu';
import NavigationMoreVert from 'material-ui/svg-icons/navigation/more-vert';
import MenuItem from 'material-ui/MenuItem';
import baseTheme from 'material-ui/styles/baseThemes/lightBaseTheme';
import getMuiTheme from 'material-ui/styles/getMuiTheme';


class Navbar extends React.Component {

    childContextTypes: {
    muiTheme: React.PropTypes.object.isRequired
}

    getChildContext() {
        return {muiTheme: getMuiTheme(baseTheme)};
    }

    render() {

        return (<AppBar
            title="Title"
            iconElementLeft={<IconButton><Navigationclose /></IconButton>}
            iconElementRight={
           <IconMenu
               iconButtonElement={
                <IconButton><NavigationMoreVert /></IconButton>
              }
               targetOrigin={{horizontal: 'right', vertical: 'top'}}
              anchorOrigin={{horizontal: 'right', vertical: 'top'}}
          >
              <MenuItem primaryText="Refresh"/>
                <MenuItem primaryText="Help"/>
              <MenuItem primaryText="Sign out"/>
           </IconMenu>
        }
        />);
    }
}


export default Navbar;

谁能帮我为使用 Material-UI 的组件设置主题,或者有一个工作示例

提前致谢。

【问题讨论】:

    标签: meteor reactjs material-ui


    【解决方案1】:

    看看这个简单的工作example

    【讨论】:

    • 该示例不使用来自 kadira 的 react-mounter。我的问题更多的是如何在使用 react-mounter 时设置主题
    猜你喜欢
    • 1970-01-01
    • 2019-09-14
    • 2015-12-26
    • 2020-01-20
    • 2020-06-24
    • 2020-05-04
    • 2021-11-14
    • 2020-07-05
    • 2019-12-24
    相关资源
    最近更新 更多