如何在 ReactJs 中添加 C++ 的图标答案

【问题标题】：How to add icon of C++ in ReactJs如何在 ReactJs 中添加 C++ 的图标
【发布时间】：2021-06-10 10:41:45
【问题描述】：

我正在用 ReactJs 制作一个项目，我还需要包含一些不同语言和工具的图标。如果是 Python 图标，我做了：

  <ListItem>
    <ListItemIcon className={classes.icon}>
      <span
        className="iconify"
        data-icon="simple-icons:python"
        data-inline="false"
        style={{ fontSize: "2rem" }}
      />
    </ListItemIcon>
    <ListItemText
      primary="Python"
      classes={{ primary: classes.listItemText }}
    />
  </ListItem>

And I got the this result

ListItem 是从 Material-Ui 导入的

但是当我对 C++ 做同样的事情时：

      <ListItem>
        <ListItemIcon className={classes.icon}>
          <span
            className="iconify"
            data-icon="simple-icons: C++"
            data-inline="false"
            fontSize={{ fontSize: "2.4rem" }}
          />
        </ListItemIcon>
        <ListItemText
          primary="C++"
          classes={{ primary: classes.listItemText }}
        />
      </ListItem>

I only Get C++ written and not the Icon

我在这里做错了什么？如何获取 C++ 图标 [不使用图像（.jpg/.png 文件）]

【问题讨论】：

欢迎来到stackoverflow！你用的是什么图标集？会不会是simple-icons: C++ 中的额外间距？
它是 react 中的一个图标包（react-simple-icons）。间距无关紧要，它不会改变输出。正确的说法应该是data-icon="simple-icons:cplusplus"

标签： javascript reactjs react-native react-redux material-ui

【解决方案1】：

经过多次尝试，我终于弄清楚了正确的说法，应该是：

data-icon="simple-icons:cplusplus"

cplusplus 代替 C++

【讨论】：