Функция onChange в customInput из пользовательского интерфейса материала

Question

Я использую шаблон, основанный на материале пользовательского интерфейса. Я пытаюсь поставить onChange в этом коде, но он не работает. Я также пытаюсь добавить onChange в customInput тоже, но все еще не работает. Я думаю, чтобы положить 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"
    }}
 />

Здесь - источник примера, а также обсуждение использования события 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}`
    }}
/>