javascript - 渲染组件后如何手动更改“选择”的值

Question

我已将 Select 的值设置为本地状态变量。子组件更新该状态更改。但下拉菜单将无法更改所选值。请有人检查下面的代码并纠正我。谢谢

父组件

class EditVehicle extends Component {
    constructor(props) {
        super(props);
        this.state = {
            values: {
                vehicleOwner: '',
            },

        }
    }
    setVehicleOwner = (owner) => {
        console.log(owner);
        this.setState({ vehicleOwner: owner._id });

    };
    render() {
        const { values } = this.state;
        return (
            ......
            <FormControl className={classes.formControl} >
                <Select
                    value={this.state.values.vehicleOwner}
                    onChange={this.handleChange}
                    inputProps={{
                        name: 'vehicleOwner',
                        id: 'vehicleOwner',
                    }}>
                    {this.props.vehicleOwnersList && this.props.vehicleOwnersList.map((owner, index) => (
                        <MenuItem value={owner._id} key={index}>{owner.firstName} {owner.lastName}</MenuItem>
                    ))}
                </Select>
                <Tooltip title="New Vehicle Owner">
                    <IconButton className={classes.button} aria-label="New Vehicle Owner" color="primary" onClick={this.handleOpenOwnerCreateModal}>
                        <AddIcon />
                    </IconButton>
                </Tooltip>
            </FormControl>
            ......
            <Modal
                aria-labelledby="simple-modal-title"
                aria-describedby="simple-modal-description"
                open={this.state.openOwnerCreateModal}
                className={classes.modal}
                onClose={this.handleCloseOwnerCreateModal}>
                <NewVehicleOwnerModal
                    set={this.setVehicleOwner}
                    selected={null}
                    action={this.handleCloseOwnerCreateModal} />
            </Modal>
        );
    }
}

标签： javascriptreactjsreact-reduxmaterial-ui