Javascript 从材质ui组件提取样式

AppBar为特定类型的子级应用某些样式。不幸的是，这种情况只发生在指导儿童

<AppBar title="first" iconElementRight={
    <FlatButton label="first" />
}/>
<AppBar title="second" iconElementRight={
    <div>
        <FlatButton label="second" /> <!-- styles are not applied -->
    </div>
}/>

不幸的是，我想不出如何消费它。有没有什么方法可以做到这一点，而不是我自己重新定义所有的风格

PS 我正在使用导入指令导入组件

import AppBar from 'material-ui/AppBar';

---

MuiThemeProvider

将

muiTheme

对象添加到上下文中，以便您可以从中获取所有样式

Comp.contextTypes = {
  muiTheme: React.PropTypes.object
}

render: function () {
        let {appBar} = this.context.muiTheme; // appBar styles here
        ...
}

---

听起来您需要一个自定义组件来将样式重新路由到所需的子级。此版本仅将

样式

转发给子级，其余部分保留在包装组件上（默认情况下为

），但可以根据您的要求进行自定义

constyledelegate=函数（props）{
const{component:component，children，style，…rest}=props；
//将样式传递给唯一的子项，并将其他所有内容传递给组件
//可以为其他道具进一步定制
返回(
{React.cloneElement（子元素，{style}}
);
};
StyleDelegate.defaultProps={
组件：“div”
};
常量AppBar=函数（道具）{
返回(
{props.title}
{React.cloneElement（props.iconElementRight，{style:{color:'blue'}}}
);
}
ReactDOM.render（，
document.querySelector（“#app”）
);

您希望实现什么目标？从AppBar获取样式并覆盖
文本颜色？或者只是从AppBar获取样式？@QoP:我想将我放在那里的FlatButton和一些IconMenu设置为样式，因为它们被指定为iconElementRight的直接子级。为此，我计划从AppBar获取样式，并为我的元素覆盖它（应该是关于颜色和位置的）。谢谢。我认为这比在自己的组件中硬编码颜色要好。不过，如果能从中获得准确的样式，那就太好了。我不需要对其他属性执行相同的操作，它将在AppBar更改时自动更新。似乎还导出了getStyles函数。你们认为有什么方法可以称之为“内部”函数吗？我认为这是不可能的，似乎是一个“内部”函数。您可以尝试使用“material ui/AppBar/AppBar”中的
import{getStyles}导入它，并使用getStyles（this.props，this.context）调用它，但不确定它是否有效。
Comp.contextTypes = {
  muiTheme: React.PropTypes.object
}

render: function () {
        let {appBar} = this.context.muiTheme; // appBar styles here
        ...
}