MUI v5 - 将组件名称添加到“样式化”类名称中？

Question

我在 github 和这里做了一些搜索，但也许我做错了。

使用styledfrom@mui/material/styles生成随机类名，如下所示：

const TitleWrapper = styled('div')`
  display: flex;
  justify-content: space-between;
  margin-bottom: 2rem;
`

有时，当我们不知道渲染的组件来自哪里时，调试应用程序会变得很困难。

有一个参数可以通过propoption传递给类，该 prop 会向类添加后缀：styledlabel

const TitleWrapper = styled('div', { label: 'TitleWrapper' })`
  display: flex;
  justify-content: space-between;
  margin-bottom: 2rem;
`

是否有一种自动添加后缀来识别组件的方法？在每个组件中都这样做真的很痛苦。

Answer 1

为了获得自定义类名，我建议您使用 scss （您自己的自定义类和样式），然后您可以将您需要的每种样式放在那里，实际上这就是我现在正在做的事情，除非我需要一些样式基于一些动态数据的样式，然后我可以使用两者：我的自定义 scss 类和样式组件类