Я использую Firebase и Redux для обработки регистрации пользователей и входа на мой сайт. Я хочу отображать ошибки входа в систему, если они есть. Я использовал точно такой же код для регистрации, и ошибки регистрации были успешно отображены. Однако ошибки входа не отображались. «Ошибка» действительно появилась на консоли. Кроме того, я использовал одни и те же типы (AUTH_SUCCESS и AUTH_FAIL) для успешных / неудачных попыток регистрации и входа в систему.
Большое спасибо за ваше терпение!
Действие входа Redux
export const logIn = (credentials, history) => (dispatch) => {
firebase.auth().signInWithEmailAndPassword(
credentials.email,
credentials.password
).then(() => {
dispatch({ type: AUTH_SUCCESS })
}).then(() => history.push(`/waitingroom`))
.catch((err) => {
console.log("fail");
dispatch({ type: AUTH_FAIL, err })
})
}
Redux authReducer
const initialState = {
authError: null
}
const authReducer = (state = initialState, action) => {
const {type, payload} = action;
switch(type) {
case AUTH_SUCCESS:
return {
...state,
authError: null
}
case AUTH_FAIL:
return {
...state,
authError: action.err.message
}
default: return state;
}
}
Вход в систему
const { authError } = this.props;
return(
<div style={signUpStyle}>
<form onSubmit={this.handleSubmit}>
<span><br/>Email Name:</span>
<input id="em"placeholder="Email" onChange={this.handleChange} required></input>
<span><br/>Password:</span>
<input id="pw" placeholder="Password" onChange={this.handleChange} required></input>
<br/>
<Alert color="primary">
{ authError ? <p>{ authError }</p> : null}
</Alert>
<button style={buttonStyle}>Enter</button>
</form>
</div>
)