Question

我使用的是react-select下拉菜单，允许用户在A，B和C之间选择多个选项。当前这在UI上有效，但是当取消选择选项时，不会将其从数组。谁能给我提示这是怎么做的？（例如，选择了A，B和C，然后未选择A，如何从数组中删除A？）

    var choice = [];
    const choices = [
      {value: 'a', label: 'a'},
      {value: 'b', label: 'b'},
      {value: 'c', label: 'c'},
     ];          

    handleChange = (selectedChoice) => {
    this.setState({ selectedChoice });
    for (var i =0; i < selectedChoice.length; i++) {
       if (choice.indexOf(selectedChoice[i].value) == -1){
       choice.push(selectedChoice[i].value); 
        }
      }
    }

然后，进一步在代码控制台中调用log（choice），单击按钮时打印。随后：

render(){
 return (
  <Div ClassName = "box">
   <Select options = {choices}
     isMulti
     value = {this.state.selectedChoice}
     onChange = {this.handleChange}
    /> </Div> );}

按和弹出按钮不起作用，因为该选项可能在中间。

Answer 1

您不需要其他选择变量。您已经具有selectedChoice状态，它将为您存储所有选定的值。

有效的解决方案：https://codesandbox.io/embed/0pr9yoo8l

反应选择下拉选项未正确存储

1 个答案: