1 回答

TA貢獻1784條經驗 獲得超7個贊
import React, { Component } from 'react'
import Select from 'react-select'
export default class App extends Component {
state = {
selectedValue:null
}
data = [
{
label: 'john',
value: 'John Doe',
},
{
label: 'jane',
value: 'Jane Doe',
},
{
label: 'mary',
value: 'Mary Phillips',
},
{
label: 'robert',
value: 'Robert',
},
{
label: 'karius',
value: 'Karius',
},
]
render() {
return (
<Select
options={this.data}
isSearchable
value={this.state.selectedValue}
onChange={this.handleChange}
/>
)
}
}
如果您想顯示帶有搜索選項的下拉菜單,我建議您使用 react-select 庫。但是,您的數據應該采用像 {label:' ',value:' '} 這樣的對象形式。這個組件有一個 isSearchable 屬性,它允許我們搜索下拉菜單以及手動選擇一個選項。希望這可以幫助!
添加回答
舉報