Question

我正在使用基于用户界面ui的模板。我尝试将onChange放在此代码中，但它不起作用。我也尝试在customInput中添加onChange，但仍然无法正常工作。我想把onChang放在inputProps里面，但是我不知道如何将函数放在对象中。

handleChange = e => {
    const {name, value} = e.currentTarget;
    this.setState({[name]: value});
};
......
<CustomInput
                             labelText="Username"
                             id="username"
                             name='username'
                             **onChange = {e =>this.handleChange(e)}
                             formControlProps={{
                               fullWidth: true
                             }}
                             inputProps={{                              
                              value: `${this.state.user.username}`, 
                            }}
                           />

如何解决此问题？谢谢

Answer 1

有关如何使用onChange的示例：

<CustomInput
    id="pass"
    formControlProps={{
        fullWidth: true
    }}
    inputProps={{
        onChange: (event) => this.handleChange(event),
        placeholder: "Password",
        type: "password"
    }}
 />

Here是该示例的源代码，也是有关如何使用onChange事件的讨论。

最后，假设所有其余代码都可以正常工作，这就是您所需要的（某种）：

handleChange = e => {
    const {name, value} = e.currentTarget;
    this.setState({[name]: value});
};
......
<CustomInput
    labelText="Username"
    id="username"
    name='username'
    formControlProps={{
        fullWidth: true
    }}
    inputProps={{   
        onChange: (e) => this.handleChange(e),                           
        defaultValue: `${this.state.user.username}`
    }}
/>

材质ui

1 个答案: