Javascript 有没有办法通过语义UI获得动态图标？

我用React从语义用户界面中得到了这个图标

其中，单词可以是基于用户输入的任意字符串。有没有办法让它不出错？我现在有这样的错误

Warning: Failed prop type: Invalid prop `name` of value `user github` supplied 
to `Icon`.

Instead of `user github`, did you mean:
  - user
  - users
  - github

它看起来只需要一个单词，但我希望它能够接受多个单词

当图标加载时，是否有办法显示奖杯图标，但当人们在语义UI的库中输入与图标匹配的单词时，它会切换到该图标？当他们删除这个词时，它应该返回到奖杯图标

---

谢谢

错误是由

propTypes

进行的测试造成的。它不应该发生在生产中，因为React会自动禁用它，但它会出现在开发中，以警告您传递错误的道具

如果要确保输入是有效的道具，解决方法是检查

words

，以确保它存在于语义ui提供的图标中

您可以通过如下方式导入图标列表：

从'semantic ui react/src/lib/SUI'导入{所有上下文中的所有图标}

所有上下文中的所有图标都是图标名称的数组，所以只需检查并查看传递的名称是否在该数组中。
这可能不是最好的方法，但我就是这么做的。
首先，我给每个我想要动态的图标添加了一个ID

<Icon ... id={`...-${index}`} color="teal" name={`${DEFAULT_ICON}`} />

此解决方案还接受最后一个有效单词，因此如果输入字段包含“idea wizard”，它将使用向导图标。
我应该补充一点，这段代码实际上可以工作，但在控制台中会抛出多个错误。还有一个轻微但非常明显的延迟（可能是错误造成的）。感谢您的回复！但是你能给我一个代码示例，看看它是什么样子吗？
const val = e.target.value; (Value of the Input Field)
let icon = `${DEFAULT_ICON}`; (Whatever you want the fallback icon to be
let words = val.split(' ');

for (let i = 0; i < words.length; i++) {
  let word = words[i];
  if (ALL_ICONS_IN_ALL_CONTEXTS.indexOf(word.toLowerCase()) > -1) {
    icon = word;
  }
}
$(`#...-${index}`)[0].className = `teal icon ${icon}`;

import { ALL_ICONS_IN_ALL_CONTEXTS } from 'semantic-ui-react/dist/commonjs/lib/SUI';
import $ from 'jquery';