2017-02-20 62 views
1

我正在使用react-bootstrap和ReactJS。我期待選擇選項作爲參數,但沒有看到填充選項的方式。這是迄今爲止的代碼。我如何傳遞數據react-bootstrap添加選項以選擇 - ReactJS

render() { 

    return (
     <div> 
      <Button bsStyle="primary" onClick={this.open}>Add Parameter</Button> 
      <Modal show={this.state.showModal} onHide={this.close}> 
       <Modal.Header> 
        <Modal.Title>Add/Edit Parameter</Modal.Title> 
       </Modal.Header> 
       <Modal.Body> 
        <form> 
         <FormGroup controlId="parameterType"> 
          <ControlLabel>Type</ControlLabel> 
          <FormControl componentClass="select" placeholder="Type"> 
           <option value="select">select</option> 
           <option value="other">...</option> 
          </FormControl> 
         </FormGroup> 
        </form> 
       </Modal.Body> 
       <Modal.Footer> 
        <Button bsStyle="primary" onClick={this.close}>Save Changes</Button> 
       </Modal.Footer> 
      </Modal> 
     </div> 
    ) 
} 

回答

1

您會映射您的數據以編程方式生成選項。假設你的選擇是在一個陣列中: options=[{value: 'select'}, {value: 'other'}]

<FormControl componentClass="select" placeholder="Type"> 
    { 
    options.map((option, index) => { 
     return (<option key={index} value={option.value}>{option.value}</option>) 
    }) 
    } 
</FormControl>