React Select 在 onChange 参数中传递多个选项答案

【问题标题】：React Select pass multiple options in parameter on onChangeReact Select 在 onChange 参数中传递多个选项
【发布时间】：2021-07-28 12:58:54
【问题描述】：

我在我的项目中使用 React Select，我遇到了一种情况，我需要遍历一个数组并在每个循环中显示 Select 选项。

          {Array.apply(null, { length: 3 }).map((item, index) => (
             
              <div className="wrapper-person-2">
                <p className="tab-text">Profissão</p>
                <Select
                  value={calcFormikValuesSelect()}
                  name={`relation[${index}]`}
                  onChange={handleChange}
                  options={options}
                  className="select-smoker"
                />
    
              </div>

          ))}

现在对于 onChange，我使用的是文档中提到的函数

 const handleChange = selectedOption => {
    this.setState({ selectedOption });
    console.log(`Option selected:`, selectedOption);
  };

但问题是我的工作也需要将我的“索引”值传递给 onChange 函数，所以我考虑在 onChange 上传递多个参数，但遗憾的是发现没有任何用处:(

希望有人帮助我，谢谢！

【问题讨论】：

标签： reactjs react-select

【解决方案1】：

要将多个参数传递给handleChange，只需这样调用它：

      {Array.apply(null, { length: 3 }).map((item, index) => (
         
          <div className="wrapper-person-2">
            <p className="tab-text">Profissão</p>
            <Select
              value={calcFormikValuesSelect()}
              name={`relation[${index}]`}
              onChange={(selectedOption) => handleChange(selectedOption, index)}
              options={options}
              className="select-smoker"
            />

          </div>

      ))}

然后：

const handleChange = (selectedOption, index) => {
    this.setState({ selectedOption });
    console.log(`Option selected:`, selectedOption);
    console.log(`Index selected:`, index);
  };

【讨论】：