Неопределенная ошибка ввода в Basi c Форма обработки ReactJs - PullRequest
0 голосов
/ 20 февраля 2020

Я работаю над формой ReactJs с библиотекой React Bootstrap, я получил ошибку Не определено при запуске формы в браузере. В Терминале у меня нет ошибок.

constructor(props){
    super(props);

    this.state = {
        username: '',
        password: '',
        fullname: ''
    }

    this.handleUsername = this.handleUsername.bind(this);
    this.handlePassword = this.handlePassword.bind(this);
    this.handleFullname = this.handleFullname.bind(this);
    this.submitUser = this.submitUser.bind(this);
}

handleUsername = (event) => {
    this.setState({
        username : event.target.value
    }, () => console.log(this.setState))

}

handlePassword = (event) => {
    this.setState({
        password: event.target.value
    })
}

handleFullname = (event) => {
    this.setState({
        fullname: event.target.value
    })
}

Я попробовал некоторые предложения в форме обработки, но все еще не работал. вот форма, которую я закодировал:

<Form className="salesUser text-left " variant="success" onSubmit={this.submitUser}>
    <Form.Group>
         <Form.Label>Username</Form.Label>
         <Form.Control type="text" value={this.state.username} onChange={this.handleUsername}></Form.Control>
    </Form.Group>
    <Form.Group>
        <Form.Label>Password</Form.Label>
        <Form.Control type="password" value={this.state.password} onChange={this.handlePassword}></Form.Control>
    </Form.Group>
    <Form.Group>
        <Form.Label>Full Name</Form.Label>
        <Form.Control type="text" value={this.state.fullname} onChange={this.handleFullname}></Form.Control>
    </Form.Group>
    <Row>
        <Col>
            <Button type="submit" value="Submit" block>Submit</Button>
        </Col>
    </Row>
</Form>

Я пытался поместить console.log в handleUsername, чтобы найти ошибку, и это сообщение об ошибке, когда я что-то набираю в имени пользователя формы.

enter image description here

надеюсь, на этот раз я задам правильный вопрос

Ответы [ 2 ]

1 голос
/ 20 февраля 2020
handleUsername = (event) => {
    this.setState({
        username : event.target.value
    })
    console.log(this.setState) //**invlaid code** should be this.state but still you won't get the updated state. Instead try this as below

    this.setState({
        username : event.target.value
    }, () => console.log(this.state)) //this callback function will log your updated state in console.
}
0 голосов
/ 20 февраля 2020

Проблема с

console.log(this.setState)

Требуется объект для обновления состояния, удаления журнала и попытки

...