從道具數據的Reactjs下拉列表人口

Question

我想創建一個下拉選擇框，但使用我已傳遞給組件的一些數據填充下拉框中的列表項。我一直在遇到「Uncaught Invariant Violation：輸入是無效的元素標記，不得有children或使用props.dangerouslySetInnerHTML。檢查AssignModal的呈現方法。」錯誤，我不知道如何解決它。這裏是我使用的代碼：

在此功能中我試圖動態生成下拉項

createUserDropdown: function() { 
let items = []; 

for (let i = 0; i < this.props.userData.user_data.length; i++) { 
    items.push(<option key={this.props.userData.user_data[i].id} value={this.props.userData.user_data[i].id}>{this.props.userData.user_data[i].first_name}</option>); 
} 
return items; 
} 

這裏是我的渲染功能

render: function() { 
return (
<div> 
    <form className='form-inline' onSubmit={this.handleSubmit}> 
    <input type="select" label="Multiple Select" multiple> 
     {this.createUserDropdown()} 
    </input> 
    </form> 
</div> 
) 
} 

Answer 1

選擇是不是有效輸入類型。選擇實際上有它自己的標籤與它的孩子正在選擇。只需將<input>更改爲<select>即可。更多的信息在這裏：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select