我必须通过选择下拉按钮来存储汽车类型值
<Dropdown direction="down" isOpen={this.state.dropdownOpen} toggle={this.toggle} >
<DropdownToggle caret outline color="info">
Select your Vehicle Type
</DropdownToggle>
<DropdownMenu onChange={this.handleChange} name="carType" >
<DropdownItem name="classic">Classic</DropdownItem>
<DropdownItem name="deluxe">Deluxe</DropdownItem>
<DropdownItem name="luxury">Luxury</DropdownItem>
<DropdownItem name="superLuxury">Super Luxury</DropdownItem>
<DropdownItem name="limousine">Limousine</DropdownItem>
<DropdownItem name="exo">Exotic Cars</DropdownItem>
</DropdownMenu>
我的onChange
函数是
handleChange = event => {
this.setState({
[event.target.name]: event.target.value
});
};
当我选择下拉按钮时,我无法获得值。请提示将值存储到数据库中
最佳答案
使用 react strap 获取下拉列表的值:
<Dropdown direction="down" isOpen={this.state.dropdownOpen} toggle={this.toggle} >
<DropdownToggle caret outline color="info">
Select your Vehicle Type
</DropdownToggle>
<DropdownMenu name="carType" >
<DropdownItem name="classic" value="classic" onClick={this.handleChange} >Classic</DropdownItem>
<DropdownItem name="deluxe" value="deluxe" onClick={this.handleChange} >Deluxe</DropdownItem>
</DropdownMenu>
所做的更改:
- 使用 onClick 而不是 onChange。
- handleClick 正在读取实际单击的选项,因此它在 DropdownItem 上。
- 您正在请求
event.target.value
但您没有“值”,所以我添加了它。如果您想使用来自 您将使用 DropdownItemevent.target.innerText
关于reactjs - 如何处理 react 下拉列表中的选择,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54354691/