dart 物料-UI-警告

yzuktlbb 于 2022-12-28 发布在其他

关注(0)|答案(5)|浏览(133)

我在我的项目中第一次使用材质UI选项卡，一切正常，但在运行项目时，控制台中有一个错误，这里是：
警告：失败的 prop 类型：材料-UI：overlap="rectangle"已弃用。请改用overlap="rectangular"。

5条答案

如果使用Badge组件，请将overlap属性的值添加或更改为rectangular。

<Badge overlap="rectangular" .../>

error来自于Badge.js

if (overlap === 'rectangle') {
  throw new Error('Material-UI: `overlap="rectangle"` was deprecated. Use `overlap="rectangular"` instead.');
}

我希望这将给一些人给予一些安心;）

我最近也遇到过同样的警告，如果你使用徽章组件，并且你可能在react 18上，那么你应该像@bluehipy提到的那样把重叠属性传递给徽章组件

<Badge overlap="rectangular"></Badge>

我也有同样的问题，你用的是@material-ui/data-grid吗？
我用@mui/x-data-grid解决了这个问题。
有一点要注意的是，你需要降级的React。

$ npm i react@17.0.0 react-dom@17.0.0

打完这个之后。

npm install @mui/material @emotion/react @emotion/styled
npm install @mui/x-data-grid
npm install @mui/icons-material

执行此命令。
之后，更改导入。

import { DataGrid } from '@mui/x-data-grid'

如果错误未解决，请表示歉意。

一定是由于库的版本冲突，我已经尽可能多地将以"@material-ui/..."开头的导入更改为以"@mui/material"开头的较新版本，并且效果很好

我已经解决了这个问题，简单地添加 prop 的徽章组件，我们正在使用无处不在。
Click here for code

<Badge overlap="rectangular">
  <ShoppingCartOutlined />
</Badge>