小编Pau*_*aul的帖子

据我了解，MUI 5 在后台使用 Emotion 进行样式设置，Emotion 有一个很好的辅助函数css，它看起来像返回一个字符串 - 一个可以用作值className或任何其他属性的类名。

import { css, cx } from '@emotion/css'

render(
  <div
    className={css`
      padding: 32px;
      background-color: hotpink;
      font-size: 24px;
    `}
  >
    Text
  </div>
)

我到处寻找，但找不到 MUI 中可用的模拟。system 和 styled-engine 中有css函数，但它似乎没有做同样的事情，它返回SerializedStyles。

我希望使用它的用例如下：

我有一个组件，可让您传递该组件不同部分的类名（字符串），从而使您能够更改组件的样式。看来这个css功能（如情感文档中所示）可以帮助我解决这个问题。

例如：

import { css, cx } from '@emotion/css'

render(
  <div
    className={css`
      padding: 32px;
      background-color: hotpink;
      font-size: 24px;
    `}
  >
    Text
  </div>
)

我想我可以解决它，makeStyles()但它不是“遗留”的，上面屏幕截图中显示的语法对我来说更有吸引力。