ReactJS Semantic UI 如果用户选择相同的项目两次,下拉菜单 onChange 将不会触发

ReactJS Semantic UI dropdown onChange won't fire if the user selects the same item twice

我有一个包含 3 个选项的文件菜单:

const fileOptions = [
  { key: 'open', icon: 'open folder outline', text: 'Open lesson', value: 'open' },
  { key: 'save', icon: 'save', text: 'Save lesson', value: 'save' },
  { key: 'delete', icon: 'delete', text: 'Delete lesson', value: 'delete' },
]

一切正常,但如果我 select 例如 "Save lesson" 两次,它只会在第一次工作(我正在使用 onChange 事件)。那是因为下拉菜单的值没有改变。我应该使用什么事件?

     <Button.Group color='teal'>
        <Dropdown

          className='button icon'
          floating
          options={fileOptions}
          trigger={<React.Fragment />}
          onChange={this.handleLessonMenu}
        />
      </Button.Group>

尝试使用 onClick 事件而不是 onChange。所以它会在你每次点击选项时触发。

我通过如下更改代码来解决问题:

      <Dropdown
        text='File'
        fluid
      >
        <Dropdown.Menu >
          <Dropdown.Item text='Add section'
            onClick={this.addSection}
          />
          <Dropdown.Divider />
          <Dropdown.Item text='New lesson' />
          <Dropdown.Item text='Open lesson' description='ctrl + o' />
          <Dropdown.Item text='Save lesson' description='ctrl + s'
            onClick={this.handleSave}
          />
          <Dropdown.Divider />
          <Dropdown.Item text='Delete lesson' description='ctrl + d' />
        </Dropdown.Menu>
      </Dropdown>