Question

以下是我用工具栏实现LeftNav的代码。我正在为meteor使用Material-UI包。 LeftNav根本没有显示出来。当与AppBar一起使用的类似配置时，它可以正常工作。需要一些帮助来解决问题。

    var {Toolbar, ToolbarGroup, , ToolbarTitle, FontIcon,FlatButton,ToolbarSeparator,IconButton,LeftNav,FlatButton} = MUI;

    let {SvgIcons} = MUI.Libs;
    let LeftIcon = <SvgIcons.NavigationExpandMore />

let LeftIcon = <SvgIcons.NavigationExpandMore />

var menuItems = [
    { route: 'get-started', text: 'Get Started' },
    { route: 'customization', text: 'Customization' },
    { route: 'components', text: 'Components' },
    { type: MenuItem.Types.SUBHEADER, text: 'Resources' },
    {
        type: MenuItem.Types.LINK,
        payload: 'https://github.com/callemall/material-ui',
        text: 'GitHub'
    },
    {
        text: 'Disabled',
        disabled: true
    },
    {
        type: MenuItem.Types.LINK,
        payload: 'https://www.google.com',
        text: 'Disabled Link',
        disabled: true
    }
    ];
    injectTapEventPlugin();

    Header = React.createClass({

        _toggle(e){
            e.preventDefault()
            this.refs.leftNav.toggle()
        },

        render(){
            return(
                <div>
                    <LeftNav ref="leftNav" docked={false} menuItems={menuItems onLeftIconButtonTouchTap={this._toggle}} />
                <Toolbar>
                    <ToolbarGroup key={0} float="left">
                        <ToolbarTitle text="React" />
                    </ToolbarGroup>
                    <ToolbarGroup key={1} float="right">
                        <FontIcon className="muidocs-icon-custom-sort" />
                        <FlatButton label="Questions" linkButton={true} href="/login" secondary={true}/>}
                        <ToolbarSeparator/>
                        {Meteor.userId() ? <FlatButton label="Logout" onClick={Meteor.logout}/> : <FlatButton label="Login" linkButton={true} href="/login" primary={true}/>}
                    </ToolbarGroup>
                </Toolbar>
                </div>        
            )
        }
    });

Answer 1

我现在也只是看着这个。也许这些是不推荐使用的物品？ https://github.com/callemall/material-ui/issues/2491

然而，这是使用0.14 - 不确定你在哪个版本

更新：我在这里有一个工作示例和代码： https://github.com/dcsan/react-hot/blob/master/app/client/layouts/MainLayout.jsx#L25-L53

演示 http://react-hot.meteor.com

希望有所帮助！

Material-ui LeftNav，工具栏不起作用

1 个答案: