reactjs - Material-ui:图标的轮廓版本

Question

我在我的 React Web 应用程序中使用material-ui。我需要在组件中但在大纲版本中使用图标“操作/描述”。

根据文档:

For convenience, the full set of google Material icons are available in Material-UI as pre-built SVG Icon components.

所以我可以这样做来获得“填充”版本:

import ActionDescription from 'material-ui/svg-icons/action/description'

<div className="number">
  <ActionDescription />
</div>

但是我如何获得“大纲”版本呢？我尝试使用 css 但没有成功:

<div>
  <ActionDescription style={{black: "black"}} color="transparent" />
</div>

Answer 1

不确定当您提出原始问题时这是否可用，但来自官方 v1.3.1 文档:

For "themed" icons, append the theme name to the icon name. For instance with the

• The Outlined delete icon is exposed as @material-ui/icons/BuildOutlined
• The Rounded delete icon is exposed as @material-ui/icons/BuildRounded
• The Two Tone delete icon is exposed as @material-ui/icons/BuildTwoTone
• The Sharp delete icon is exposed as @material-ui/icons/BuildSharp

参见https://material-ui.com/style/icons/

编辑:确认这需要最新的 @material/icons 测试版包，该包几个月前可能还没有提供。安装:

npm install @material-ui/icons@2.0.0-beta.1

您应该能够访问最近文档中提到的主题图标集。