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

Question 1

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

Как я могу решить эту проблему? Спасибо

reactjs material-ui

3

Phuong Tran 23 Окт 2019 в 12:29

Answer

Пример использования 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}`
    }}
/>

2

Néstor Carreño Gimeno 23 Окт 2019 в 17:09

Question 2

Пример использования 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}`
    }}
/>

2

Néstor Carreño Gimeno 23 Окт 2019 в 17:09

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

1 ответ

Похожие вопросы

Новые вопросы

reactjs