语义ui react下拉菜单选择的项目图标

Question

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

 

 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类中。在这些自定义样式中，您可以添加带有复选标记的伪元素。