reactjs 在mui版本5中使用withStyles时出错

ih99xse1  于 2022-12-29  发布在  React
关注(0)|答案(2)|浏览(209)

我在使用withStyles方法时遇到了mui/material v5.0.4和ts v4.4.4的问题。
我得到这个错误使用AntSwitch组件:
第一个月
当material-ui软件包版本从4升级到5时出现此错误。

import { withStyles } from '@mui/styles';

const AntSwitch = withStyles((theme) => ({
  root: {
    width: 28,
    height: 16,
    padding: 0,
    display: 'flex',
  },
  switchBase: {
    padding: 2,
    color: theme.palette.grey[500],
    '&$checked': {
      transform: 'translateX(12px)',
      color: theme.palette.common.white,
      '& + $track': {
        opacity: 1,
        backgroundColor: theme.palette.primary.main,
        borderColor: theme.palette.primary.main,
      },
    },
  },
  thumb: {
    width: 12,
    height: 12,
    boxShadow: 'none',
  },
  track: {
    border: `1px solid ${theme.palette.grey[500]}`,
    borderRadius: 16 / 2,
    opacity: 1,
    backgroundColor: theme.palette.common.white,
  },
  checked: {},
}))(Switch);

<AntSwitch
  checked={!isDisabled}
  onChange={(_, checked) => onToggleDisability(!checked)}
  name="Disability"
/>
ejk8hzay

ejk8hzay1#

确保@types/react和react的版本是匹配的,这为我解决了类似的问题。此外,你可以尝试删除node_modules,更新Node JS和其他包作为经验法则。

w8biq8rn

w8biq8rn2#

我将**@types/react的版本更新为^18.0.26**,现在运行良好!

相关问题