扩展样式材质的用户界面 [英] extend style material UI
本文介绍了扩展样式材质的用户界面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
有没有办法在reactjs上扩展样式 我尝试了扩展样式,但效果显着
is there way to extend style on reactjs I tried extend style but its dosent work
cellItem:{
color: "black",
fontWeight: "bold",
[theme.breakpoints.down("xs")]: {
fontSize: "0.8em"
},
},
tableCellItem: {
extend:"cellItem", --> here I extend parent style
fontSize: "1.5em"
},
tableCellItemInSingleScreen: {
extend:"cellItem",--> here I extend parent style
fontSize: "2.5em"
}
推荐答案
您可以为此使用JavaScript功能:
You can just use JavaScript features for this:
const styles = theme => {
const cellItem = {
color: "black",
fontWeight: "bold",
[theme.breakpoints.down("xs")]: {
fontSize: "0.8em"
}
};
return {
cellItem,
tableCellItem: {
...cellItem,
fontSize: "1.5em"
},
tableCellItemInSingleScreen: {
...cellItem,
fontSize: "2.5em"
}
};
};
JSS中有一个扩展插件这会导致您的语法正常工作,但它不是插件默认情况下包含在Material-UI中,但是您可以添加该插件.
There is an extend plugin within JSS that would cause your syntax to work, but it is not one of the plugins included within Material-UI by default, but you can add that plugin.
这篇关于扩展样式材质的用户界面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文