Form.Control ，如何从通过JSON填充的下拉列表中进行选择

Question

Form.Control，如何从Axios Get请求通过JSON填充的下拉列表中进行选择。现在，即使我从下拉

中选择1个项目，当我尝试发送发布请求时，也会选择整个JSON对象

enter code here<Form.Group as={Col} controlId="formGridServiceType">
                            <Form.Label>Service Type</Form.Label>
                            <Form.Control required 
                                //autoComplete="off"
                                as="select" 
                                name="serviceType.type"                                                                     
                                multiple={false}
                                value={this.state.serviceType.type}
                                onChange={this.serviceChange}
                                // onChange={this.change}
                                // inputRef={e1=> this.inputEl=el}
                                className={"bg-dark-text-white"} placeholder="Enter Service Type">
                                {this.state.serviceType.map((serviceType, key) => (                                        
                                        <option key={serviceType.id} value={serviceType.type}>{serviceType.type}</option>                                            
                                ))}
                            </Form.Control>
                        </Form.Group>

我的servicechange方法是

serviceChange = event => {
    this.setState({

        [event.target.name]: [event.target.value]
    })
}

Answer 1

<Form.Control required 
                                //autoComplete="off"
                                as="select" 
                                //name="serviceType.type"   
                                name="serviceType"                                                                    
                                multiple={false}
                                //value={this.state.serviceType.type}
                                value={this.state.serviceType}
                                //value={this.serviceType}
                                onChange={this.serviceChange}
                                //onChange={this.change}
                                // inputRef={e1=> this.inputEl=el}
                                className={"bg-dark-text-white"} 
                                //placeholder="Enter Service Type"
                                >
                                {this.state.serviceType.map((serviceType, index) => (                                        
                                        <option key={index} value={serviceType.id}>{serviceType.type}</option>                                            
                                ))}
                            </Form.Control>

尝试使用所有可能的选项多次尝试后解决了