Почему мои лексемы не работают правильно? - PullRequest
Новая
       21

Почему мои лексемы не работают правильно?

0 голосов
/ 06 февраля 2020

Я пытаюсь осуществить проверку подлинности и войти в систему / выйти из системы пользователей, используя redux и firebase. У меня есть следующий код:
Типы действий: 

export const LOGIN_REQ = 'AUTH_REQ';
export const LOGOUT_REQ = 'LOGOUT_REQ';
export const AUTH_SUCCESS = 'AUTH_SUCCESS';
export const AUTH_FAILED = 'AUTH_FAILED';
export const GET_AUTH = 'GET_AUTH';

Редукторы: 

import * as ActionTypes from './ActionTypes';
export const auth = (state = {
    isAuth: false,
    user: null
}, action) => {
    switch (action.type) {
        case ActionTypes.LOGIN_REQ:
            return { ...state, isAuth: false, user: null };
        case ActionTypes.LOGOUT_REQ:
            return { ...state, isAuth: false, user: null };
        case ActionTypes.AUTH_FAILED:
            return { ...state, isAuth: false, user: null };
        case ActionTypes.AUTH_SUCCESS:
            return { ...state, isAuth: true, user: action.payload };
        case ActionTypes.GET_AUTH:
            return state;
        default:
            return state;
    }
}

Thunks: 

export const getAuth = () => (dispatch) => {
    firebase.auth().onAuthStateChanged((user) => {
        if (user) {
            console.log('Get AUTH called');
            dispatch(authSuccess());
        }
        else {
            console.log('Get AUTH called');
            dispatch(authFailed());
        }
    });
}

export const loginReq = (email, password, remember) => (dispatch) => {
    firebase.auth().signInWithEmailAndPassword(email, password)
        .then((cred) => {
            if (remember === false) {
                firebase.auth().setPersistence(firebase.auth.Auth.Persistence.NONE);
                console.log('Logged In with Redux without persist');
            }
            else {
                console.log('Logging in with Persist');
            }
            console.log('Dispatching Success !');
            dispatch(authSuccess(cred.user.uid));
        })
        .catch((err) => {
            console.log(err);
            dispatch(authFailed(err));
        });
}

export const logoutReq = () => (dispatch) => {
    firebase.auth().signOut()
        .then(() => dispatch(getAuth()))
        .catch((err) => console.log(err));
}

export const authSuccess = (uid = null) => ({
    type: ActionTypes.AUTH_SUCCESS,
    payload: uid
});

export const authFailed = (resp) => ({
    type: ActionTypes.AUTH_FAILED,
    payload: resp
});

И я звоню из компонент, как показано ниже: 

const mapStateToProps = state => {
    return {
        isAuth: state.isAuth,
        user: state.user
    }
}

const mapDispatchToProps = dispatch => ({
    getAuth: () => { dispatch(getAuth()) },
    loginReq: (email, password, remember) => { dispatch(loginReq(email, password, remember)) },
    logoutReq: () => { dispatch(logoutReq()) }
})  
handleLogin() {
       this.props.loginReq(this.state.email, this.state.password, this.state.remember);
  }
handleLogOut() {
        this.props.logoutReq();
    }
<BUTTON onClick=()=>this.handleLogOut()/handleLogin()>

Я близок к слезам, потому что не могу понять, почему мой loginReq запускает один или несколько методов gitAuth (), даже когда я нажимаю на кнопку один раз. Это происходит только для действия loginReq (). Я нигде не указал, что loginReq () должен его запустить. Кроме того, я вызвал метод getAuth () в компоненте, который сделал метод монтирования моего главного экрана, который проверяет статус аутентификации один раз в начале приложения.
РЕДАКТИРОВАТЬ: я вошел в консоль, компонент сделал метод монтирования в основной компонент, поэтому я знаю, что этот вызов getAuth () не приходит оттуда.

Ответы [ 2 ]

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

Imo ответ сделан плохо, попробуйте лучше реструктурировать его, то, что вы называете "Thunks", на самом деле "Actions". Но если бы я хотел сказать вам кое-что, что могло бы помочь, то, возможно, проблема заключается в конфигурации промежуточного программного обеспечения thunk или в том, как диспетчер обрабатывает firebase, поэтому я бы сказал, что вам лучше попробовать кодировать apporach с помощьюact-redux -firebase library (эта: http://react-redux-firebase.com/docs/getting_started) упрощает соединение редукса с бэкэндом Firebase. Другой замечательный источник, с которым я узнал, - это учебный плейлист Net Ninja о реагировании, редуксе и огненной базе.

0 голосов
/ 06 февраля 2020

Мой друг сказал мне, что это связано с чем-то, известным как 'Observer', который находится в onAuthStateChange (), предоставляемом firebase. По сути, существует конфликт между мной, вручную рассматривающим пользователя как аутентифицированного, и наблюдателя, делающего это.

...