从 React select 表单中检索值数组

Question

所以基本上我是在尝试创建一个带有 select 下拉框的表单。我试图通过值属性将一组值发送到 onChange 函数，但它只是给了我一个字符串。如何传回值并以数组形式访问它们？

reactjs 站点显示这在 select 标签下是可能的，但不是如何访问值...

https://reactjs.org/docs/forms.html#the-select-tag

    <Input type="select" name="university" id="university" onChange={this.onSelect}>

    {this.props.universities.universities.map(({ idUniversity, name}) => (
       <option key ={idUniversity} value = {[idUniversity , name]}>
         {name}
       </option>
    ))}

    </Input>

    onSelect = (e) => {
        console.log(e.target.value[0] + " " + e.target.value[1] );
        this.setState({
            university_id: e.target.value[0],
            university_name: e.target.value[1]
        });
    }

当我运行这个时，e.target.value[0] 给我 {[idUniversity , name]} 给出的整个字符串的第一个字符。

例如，数组应该是 [2, University of Central Florida]，但是 e.target.value[0] 将 return 只是 [

Answer 1

有一些可能的方法可以使用 index 到 select 初始数据中的项目，但是在您的情况下，可能最简单的方法是 split 将值返回数组形式：

onSelect = (e) => {
    const [university_id, university_name] = e.target.value.split(',');

    this.setState({
        university_id,
        university_name,
    });
}

从 React select 表单中检索值数组

Retrieving array of values from react select form

javascript

node.js

reactjs

reactstrap