react-bootstrap 添加要选择的选项 - ReactJS

jkr*_*z55 2 javascript reactjs react-bootstrap

我正在使用 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>
    )
}
Run Code Online (Sandbox Code Playgroud)

Kun*_*nal 6

您将映射您的数据以编程方式生成选项。假设您的选项在一个数组中: 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>
Run Code Online (Sandbox Code Playgroud)