Question

我想写a functional stateless component in ReactJs as described here并设置其样式。

const MyBlueButton = props => {
  const styles = { background: 'blue', color: 'white' };  
  return <button {...props} style={styles} />;
};

问题是我想添加一些styles from stateful components as described here。

const styles = theme => ({
  root: {
    width: '100%',
    maxWidth: 360,
    backgroundColor: theme.palette.background.paper,
  },
});

问题在于，当我尝试执行以下操作时：

<div className={classes.root}>

我得到了错误：

'classes'未定义为un-undef

如何访问withStyles classes对象以按照自己的方式设置root的样式？

Answer 1

如果我了解的是这里如何使用功能组件的方法。

const styles = theme => ( {
  root: {
    width: "100%",
    maxWidth: 360,
    backgroundColor: theme.palette.background.paper,
  },
} );

const App = ( props ) => {
  const { classes } = props;
  return <div className={classes.root}>Foo</div>;
};

export default withStyles( styles )( App );

如何使用class对象在Reactjs中设置功能性无状态组件的样式

1 个答案: