多选仅返回一个选项

时间:2019-04-18 06:11:42

标签: reactjs multi-select

我试图获取选中的选项,但是我只是从选择输入中获取了最后选择的选项。

状态永远不会更新为多个选项。只是最后一个选项,我尝试了许多选项,但没有保存多选项。

    currentPage: 3,
    custFirstname: "",
    custLastName: "",
    custPhoneNum: "",
    custEmail: "",
    vehicleNum: "",
    vehicleMake: "",
    vehicleModel: "",
    defects_tank: "",
    defects_tankLogo: "",
    defects_lightglass: "",
    defects_seatcover: "",
    defects_crashgaurd: "",
    defects_mirrors: "",
    defects_indicators: "",
    electricals_headlight: "y",
    electricals_tailLight: "y",
    electricals_console: "y",
    electricals_indicatorF: "y",
    electricals_indicatorR: "y",
    electricals_horn: "y",
    petrolLevel: "",
    battery: "",
    jobs: [],
    job: {
      description: "",
      repObserv: "",
      customerReq: "",
      typeOfService: "",
      charges: "",
      services: []
    }
  };

即时更新状态->作业->服务

handleJobsDropDown = e => {
    console.log(e.target.options);
    const { options } = e.target;

    const value = [];

    for (let i = 0, l = options.length; i < l; i++) {
      if (options[i].selected) {
        value.push(options[i].value);
      }
    }
    this.setState({
      job: { ...this.state.job, services: value }
    });
  };
  <select
              multiple={true}
              value={this.state.job.services}
              onChange={this.handleJobsDropDown}
            >
              <option value="paid">Paid Serv</option>
              <option value="free">Free Serv</option>
              <option value="chain">Chain Serv</option>
              <option value="repeat">Rpt Serv</option>
            </select>

0 个答案:

没有答案