MUI v5 Typescript makeStyles returns 从不

Question

我正在尝试将我的组件从 MUI v4 迁移到 v5，但我不知道如何迁移我的 makeStyles 组件。

以前，我有这样的东西在工作：

const useStyles = makeStyles((theme: Theme) => ({
  paper: {
    padding: theme.spacing(2),
    someMore: 'styles'
  }
}));
// ...

const Component: FC = () => {
  const theme = useTheme();
  const classes = useStyles(theme);

   return (
      <Paper elevation={3} className={classes.paper}>
         <Stuff />
      </Paper>
   )
}

现在我在 useStyles 调用中遇到错误：

This expression is not callable. Type 'never' has no call signatures.ts(2349)

这种情况下的解决方法是什么？

Answer 1

您不能使用 makeStyles from @mui/material (you'll get an error if you do so) because it's been moved to @mui/styles as makeStyles is marked as deprecated. That's why the type is never; it's not there! The function is empty and its only purpose 来告诉您 makeStyles 现在所在的位置。

@mui/styles 是遗留包，不建议在 v5 中使用。参见 answer to know more about the differences between the two of them. For alternatives, you can use styled/sx prop。

MUI v5 Typescript makeStyles returns 从不

MUI v5 Typescript makeStyles returns never

typescript

reactjs

material-ui

jss