Рендеринг компонента - PullRequest
0 голосов
/ 01 февраля 2020

Я хочу аутентифицировать пользователя. Изначально, когда я получаю ответ от сервера, что пользователь ввел «неправильный пароль», я пытаюсь установить состояние authPassword. В render () я проверяю состояние authPassword и пытаюсь отобразить «Invalid message». Но я не могу перерисовать его для отображения сообщения.

if(res === "wrongPassword")
{
     console.log(res);
     this.authPassword="password invalid";
     this.setState({authPassword});
}

render(){

        return <div className="base" >
                <div className="header">Login In</div>
                <div className="content">
                    <br/><br/>
                    <form className="form" method = 'post'>
                        <div className="form-group">
                            <input type="text" 
                                name="email"   
                                placeholder="email" 
                                className="form_field"
                                value={this.state.email}
                                onChange={this.handleChange}
                            >
                            </input>
                            {this.state.emailError? (
                            <div>
                            {this.state.emailError}
                            </div>
                            ):null

                            }
                        </div><br/>

                        <div className="form-group">
                            <input type="text" 
                                name="password" 
                                placeholder="Password" 
                                className="form_field"
                                value={this.state.password}
                                onChange={this.handleChange}
                                >
                            </input>
                            {this.state.passwordError? (
                            <div>
                            {this.state.passwordError}
                            </div>
                            ):null

                            }

                            {this.state.authPassword? (
                            <div>
                            {this.state.authPassword}
                            </div>
                            ):null

                            }         
                        </div><br/>
    {errors.form && <div className="alert alert-danger">{errors.form}</div>
                        }
                        <div className="form-group">
                            <div className = "btn">
                                <button type="button" 
                                    name="logbtn"
                                    disabled={isLoading}
                                    onClick = {this.handleSubmit}>
                                    Login
                                </button>
                            </div>
                        </div>
                    </form>   
                </div>
            </div>
        </div>
    }
}


1 Ответ

1 голос
/ 01 февраля 2020

Это должно решить проблему.

if(res === "wrongPassword")
    {
         console.log(res);
         const password="password invalid";
         this.setState({authPassword: password});
    }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...