Question

我正在使用material-ui，当选择菜单项时，它没有显示，但是它改变了状态。这是我的代码

constructor(){
        super();
        this.state={
            amount: "",
        }

// Change amount of picture
        onAmountChange = (event) => {
            this.setState({ [event.target.name]: [event.target.value]})
        }

render(){
        const { classes } = this.props;
        const { amount  } = this.state;

        return(
            <div>
                <div>

                    <FormControl>
                        <InputLabel htmlFor="amount-pic">Amount</InputLabel>
                        <Select
                            value={amount}
                            onChange={this.onAmountChange}
                            name= 'amount'

                        >   
                            <MenuItem value={5}>5</MenuItem>
                            <MenuItem value={10}>10</MenuItem>
                            <MenuItem value={15}>15</MenuItem>
                            <MenuItem value={30}>30</MenuItem>
                            <MenuItem value={50}>50</MenuItem>
                        </Select>
                    </FormControl>
                </div>
                <br/>
            </div>


        );  
    }

没有显示错误，并且它可以更改状态数量，而我选择时没有显示数字。

Answer 1

错误是您的函数onAmountChange：值是event.target.value，而不是[event.target.value]。因为[event.target.value]是一个数组

onAmountChange = (event) => {
    this.setState({ [event.target.name]: event.target.value})
}

选择后未显示Material-UI MenuItems

1 个答案: