语义 ui 反应下拉所选项目图标

Question

我正在尝试使用语义 ui 和 React 创建一个下拉/选择，并且我希望它在所选项目上显示复选标记。 我当前的代码是：

 groupSelector() {
    let groups = Object.keys(this.state.data).map((val, index) => {
      return {
        text: val,
        value: index,
        image: (
          <span style={{ color: this.state.data[val].Color }}>&#9733;</span>
        )
      };
    });
    return (
      <Dropdown
        placeholder="choose group"
        id="dropdown"
        selection
        fluid
        options={groups}
        onChange={(e, { value }) => {
          this.setGroupToShow(value, e);
        }}
      />
    );
  }

帮助任何人？

Answer 1

我会尝试使用 css 来实现这一点。为这个下拉列表添加一些自定义样式到 item.selected 类。在这些自定义样式中，您可以添加一个带有复选标记的伪元素。