Ошибки входа не отображаются - PullRequest
0 голосов
/ 03 мая 2020

Я использую 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>
    )



...