Question

我正在显示动态下拉列表，我想要保留一个特定元素或第一个元素。但我找不到方法。

<select onChange = {this.handleSelectChange}>                 
    <option>any-select</option>
    {                     
        this.state.data2.map(function(data) {                
          return  <option value={data.id}>{data.name}</option>                                                             
        })         
    }                    
</select>

Answer 1

您可以使用下面提到的代码

 this.state.data2.map(function(data,index) {                
     return index==0?<option value={data.id} selected="selected">{data.name}</option>:<option value={data.id}>{data.name}</option>                                                            
    })

Answer 2

虽然您可以在选项上添加selected="selected"，但我认为更好的方法是使用value选项。
您可以更改value处理程序中的select onChange 如果您想要选择第一个无价值选项，只需将value设置为假值，例如null

<select onChange = {this.handleSelectChange} value={/*null or selected option's data.id*/}>                 
    <option>any-select</option>
    {                     
        this.state.data2.map(function(data) {                
            return  <option value={data.id}>{data.name}</option>                                                             
        })         
    }                    
</select>

如果您想选择任何其他选项，只需将value设置为选项的值

如何在下拉列表中预先选择特定元素？

2 个答案: