Question

我是Material UI的新手。我正在使用反应，使用类以及功能组件。但是，当我使用Material UI组件以及类组件中的makeStyles之类的功能时，它会引发钩子错误，要求您不能在类组件中使用钩子。我知道钩子是一个新功能，但是我很喜欢使用类组件，因此我不想使用钩子，但仍然想使用材质UI。有办法吗？我被困住了。

使用此错误时出现：

const useStyles = makeStyles({
    card: {
      minWidth: 275,
    },
    bullet: {
      display: 'inline-block',
      margin: '0 2px',
      transform: 'scale(0.8)',
    },
    title: {
      fontSize: 14,
    },
    pos: {
      marginBottom: 12,
    },
  });

然后在组件内部调用它，如下所示： const classes1 = useStyles();

我对如何使用collapse之类的功能也感到困惑，这些功能似乎也使用了钩子：

const [expanded, setExpanded] = React.useState(false);``

```
function handleExpandClick() {
    setExpanded(!expanded);
  }

我的首要任务是继续使用类和功能组件，即使我不必使用实质性UI的组成部分，但仍以普通的CSS形式使用实质性UI。如果我有办法以普通的CSS形式使用材质ui，那么像崩溃之类的东西将如何工作？预先感谢。

Answer 1

为避免使用useStyles，请查看以下链接：https://material-ui.com/customization/components/

滚动到“使用开发工具”，它说明了如何查找需要覆盖的类名称。

为避免使用useState，请使用您确定熟悉的Class组件状态。 https://reactjs.org/docs/state-and-lifecycle.html

Answer 2

对于类组件，应使用Higher order component API（local.settings.json）而不是Hooks API（export const renderHTMLContent = (htmlContent) => React.createElement('div', { dangerouslySetInnerHTML: { __html: htmlContent}, });）。

需要使用没有组件的Material UI

2 个答案: