Question

我正在使用Which jars do I need in order to avoid "NoClassDefFoundError: com/sun/facelets/tag/jsf/ComponentHandler"? Material UI我想使用表格组件，我想更改next branch组件的样式。

我的想法是用MyTableHead包装TableHead并添加我自己的样式来覆盖当前样式。

我的代码（基于此TableHead）：

import React from 'react';
import injectSheet from 'react-jss'
import {
    TableHead,
} from 'material-ui/Table';

const styles = {
   th: {        
        fontSize:'20px',        
    },    
}

const _MyTableHead = (props) => {
    return (
        <TableHead className={props.classes.th} {...props}>
            {props.children}
        </TableHead>
    );
};
_MyTableHead.muiName = 'TableHead'    
const MyTableHead = injectSheet(styles)(_MyTableHead);


export {MyTableHead}

这不起作用：
1.我的风格被原始风格所压倒 2.我在浏览器js控制台中收到错误：

警告：标记上的未知道具sheet，classes。删除这些元素的道具。有关详情，请参阅 Composition 在thead（由TableHead创建）在TableHead中（at table.js：15）在_MyTableHead中（由Jss（_MyTableHead）创建）

我想我做得不对，任何想法？

Answer 1

尚未记录在下一个分支中定制组件的方法这是如何做到的：

import React from 'react';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import {createMuiTheme} from 'material-ui/styles/theme'
import Button from 'material-ui/Button';

const muiTheme = createMuiTheme({
  overrides:{
    MuiButton:{
      root:{
        fontSize: 20,
      }
    }
  }  
});

class Main extends React.Component {
  render() {
    // MuiThemeProvider takes the theme as a property and passed it down the hierarchy
    // using React's context feature.
    return (
      <MuiThemeProvider muiTheme={muiTheme}>
        <Button raised>Default</Button>
      </MuiThemeProvider>
    );
  }
}

export default Main;

Answer 2

Example Class from MUINext

Material UI在渲染时重新生成新类，因此您永远无法使用预设类覆盖任何一个类。

他们的班级名称看起来像MuiRoot-tableHead-23。最后一个数字是随机的。找到覆盖您的类的特定类，然后使用

[class*=MuiRoot-tableHead]{
your css settings
}

如果您已经设置了主题文件，我建议您使用yossi所说的内容。否则，您可以使用此方法手动覆盖它。

如何定制反应材料ui下一个组件

2 个答案: