首页 > 解决方案 > 如何访问 Form.control 的值?

问题描述

我正在尝试访问与 React 引导表单中选择菜单的选项相对应的值。

这是我的代码

handleChange(e) {
            var options = e.target.options;
            var selectedValues = [];
            for (var i = 0; i < options.length; i++) {
              if (options[i].selected) {
                selectedValues.push(options[i].value);
              }
            }
            console.log(selectedValues);
          }
<Form.Group controlId="Location">
    <Form.Control as="select" multiple onChange={this.handleChange}>
        <option value="1132348">New York City</option>
        <option value="1154532">Boston</option>
        <option value="1147401">San Francisco</option>
        <option value="1146821">Los Angeles</option>
        <option value="1150505">Seattle</option>
        <option value="1151614">Portland</option>
    </Form.Control>
</Form.Group>

例如,如果我选择了“纽约市”选项,我将如何访问号码“1132348”以供使用。

标签: javascriptreactjsreact-bootstrap

解决方案


当您使用带有多项选择的 select 时,请尝试这个 handleChange 甚至:

handleChange: function(e) {
  var options = e.target.options;
  var selectedValues = [];
  for (var i = 0, i < options.length; i++) {
    if (options[i].selected) {
      selectedValues.push(options[i].value);
    }
  }
  console.log(selectedValues);
}

推荐阅读