javascript - 如何在 React 中将 Unicode 字符作为函数参数传递

Question

我正在尝试实现与这个问题类似的东西 How do I include a font awesome icon in my svg?

但我有 10 个图标，它们具有相似的结构，但只有图标不同我已经返回一个函数来生成 Unicode 字符作为

static renderIcon (status) {
    if (status === 'RED') {
      return ''
    } else if (status === 'GREEN') {
      return ''
    } else if (status === YELLOW') {
      return ''
    }
  }

static renderTextWithIcon = (obj) => {
    return (
        <text x={params.cx} y={params.cy}
         className={ css.color}
         >
          {Utils.renderStatusIconContent(obj.status)}
        </text>
        )
  }

但是如果我尝试在不带引号的情况下给出它接受并显示图标，它会将字符串呈现为“”，但我必须为每种颜色重复相同的代码。如何编写一个以 Unicode 字符为参数的函数？

Answer 1

如果我没看错，你需要使用 dangerouslySetInnerHTML这样您的 unicode 字符就不会被转义。

<text x={params.cx} y={params.cy}
  className={ css.color}
  dangerouslySetInnerHTML={{__html: Utils.renderStatusIconContent(obj.status) }}
/>