reactjs - 如何捕获 React-Bootstrap 下拉列表的值？

Question

我想出了如何使用react-bootstrap来显示下拉列表:

<DropdownButton bsStyle="success" title="Choose" onSelect={this.handleSelect} >
    <MenuItem key="1">Action</MenuItem>
    <MenuItem key="2">Another action</MenuItem>
    <MenuItem key="3">Something else here</MenuItem>
</DropdownButton>

但是我该如何编写 onSelect 的处理程序来捕获正在选择的选项？我尝试了这个，但不知道里面要写什么:

handleSelect: function () {
    // what am I suppose to write in there to get the value?
},

另外，有没有办法设置默认选择的选项？

谢谢!

Answer 1

onSelect函数传递选择的值

<DropdownButton title='Dropdowna' onSelect={function(evt){console.log(evt)}}>
  <MenuItem eventKey='abc'>Dropdown link</MenuItem>
  <MenuItem eventKey={['a', 'b']}>Dropdown link</MenuItem>
</DropdownButton>

在这种情况下，如果您选择第一个选项，则会打印“abc”，在第二个选项中您可以看到也可以传入一个对象。

所以在你的代码中

handleSelect: function (evt) {
    // what am I suppose to write in there to get the value?
    console.log(evt)
},

我不确定默认值是什么意思，因为这不是一个选择 - 按钮文本是标题属性中的任何内容。如果您想处理默认值，您可以在值为 null 时设置一个值。