在React select中是否可以使用Array作为选项

时间:2018-12-30 22:41:18

标签: react-select

我的输入数据为数组格式,例如[“ A”,“ B”,“ C”],我想将它们显示为react-select中的选项。

    import React, { Component } from 'react';
import Select from 'react-select';

const test= ["a","b","c"]



class TestSelect extends React.Component {
  state = {
    multi: null,
  };

  handleChange = name => value => {
    this.setState({
      [name]: value,
    });
  };
  render() {
    return (
      <div className='dropdown' style={{ dispay: 'inline-block', width: 250, paddingLeft: 50, paddingTop: 50 }}>
        <Select
          options={test}
          value={this.state.multi}
          autosize={true}
          onChange={this.handleChange('multi')
          isMulti
          placeholder="Select Values"
        />

      </div >
    );
  }
}
export default TestSelect;

是否可以使用数组作为选项,或者始终将其作为对象?

1 个答案:

答案 0 :(得分:1)

根据文档,选项的结构必须遵循以下模式 [{label: 'your label', value: 'your value'}, ...]

您将需要像这样转换数组:

const options = test.map(v => ({
  label: v,
  value: v
}));

,然后将此值作为选项传递。

这里live example是您的代码。