用户材料-UI React 字体图标答案

【问题标题】：User Material-UI React Font Icons用户材料-UI React 字体图标
【发布时间】：2018-08-23 12:32:22
【问题描述】：

图标组件将显示来自任何支持连字的图标字体的图标。作为先决条件，您必须在项目中包含一个，例如 Material 图标字体，例如，通过 Google Web Fonts：

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

Icon 将为 Material 图标字体设置正确的类名。对于其他字体，您必须使用 Icon 组件的 className 属性提供类名。

要使用图标，只需将图标名称（字体连字）与 Icon 组件包装起来，例如：

<Icon>star</Icon>

默认情况下，图标将继承当前文本颜色。或者，您可以使用主题颜色属性之一设置图标颜色：主要、次要、操作、错误和禁用。

我包含了样式表。我无法使用<Icon /> 组件，因为<Icon /> 未定义。如何导入<Icon />？

【问题讨论】：

你可以安装material-ui和使用import { Icon } from "@material-ui/core";

标签： javascript css reactjs fonts material-design

【解决方案1】：

图标组件需要像 SGhaleb 所说的那样导入，但我会补充一点，一些图标需要不同的导入。例如，学校图标是这样导入的 import SchoolIcon from '@material-ui/icons/School' 并以 <SchoolIcon /> 调用。

这可能会或将来会发生变化，以便更容易直接从 @material-ui/icons 导入，例如 ExpandMore/ExpandLess 图标 import { ExpandLess, ExpandMore } from '@material-ui/icons'

【讨论】：