AppBar 图标ElementRight admin-on-rest答案

【问题标题】：AppBar iconElementRight admin-on-restAppBar 图标ElementRight admin-on-rest
【发布时间】：2017-10-04 13:37:34
【问题描述】：

我正在使用来自https://marmelab.com/admin-on-rest/Theming.html#using-a-custom-layout 的示例。

在下面的 sn-p 中添加了一个新的 IconMenu。不显示右侧菜单图标。通过从不同的形式调用它来测试组件，它可以工作。但是，将其集成到 AppBar 中是行不通的。

看起来样式或其他东西在干扰它。

有没有人有这样的菜单与 AppLayout 自定义配合得很好？

const styles = {
    // Snipped rest of the styles from example
    loader: {
        position: 'absolute',
        top: 0,
        right: 50,
        margin: 16,
        zIndex: 1200,
    },

    iconMenu: {
        position: 'absolute',
        top: 0,
        right: 0,
        margin: 16,
        zIndex: 1200,
    },
};

const AppBarMenu = (props) => (
    <IconMenu {...props}
        iconButtonElement={
            <IconButton><MoreVertIcon /></IconButton>
        }
        targetOrigin={{horizontal: 'right', vertical: 'top'}}
        anchorOrigin={{horizontal: 'right', vertical: 'top'}}
    >
        <MenuItem primaryText="Settings" />
        <MenuItem primaryText="About" />
        <MenuItem primaryText="Sign out" />
    </IconMenu>
);

AppBarMenu.muiName = 'IconMenu';

<AppBar title={title} iconElementRight={<AppBarMenu style={styles.iconMenu} />} />

【问题讨论】：

标签： admin-on-rest

【解决方案1】：

在https://github.com/marmelab/admin-on-rest/issues/525中使用了提案

引用上述网址：如果有人想要标题栏中的按钮，他们不仅需要自定义布局，还需要将 AppBar.js 从 admin-on-rest 复制到他们的项目中并导入。在 AppBar.js 中，iconElementRight 在 MuiAppBar 标签内有效，但在 Layout.js 内无效。

【讨论】：