reactjs - Material ui 中 customInput 中的 onChange 函数

Question

我正在使用基于 Material 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}`
    }}
/>