Асинхронный запрос не отправляется в Firebase через создателей действий

Question

Я пытаюсь создать LoginForm, в котором я размещаю пользовательский интерфейс, используя реагирующий на себя, но логика бэкэнда - через систему редуксов. Я интегрировался с библиотеками Firebase и пытаюсь сделать асинхронный вызов FireBase с помощью создателей действий и редукторов с помощью redux-thunk.

App.js

.........
.........
render()
    {
        const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));
        return(
        <Provider store={ store } >
            <LoginForm />
        </Provider>
        );
    }

LoginForm.js

class LoginForm extends Component
{
.........
.........
onButtonPress () {
        const { email, password } = this.props;
        this.props.loginUser({ email, password });
    }

render()
    {
<CardSection>
                    <Button onPress={this.onButtonPress.bind(this)} >
                        Login
                    </Button>
                </CardSection>
}
const mapStateToProps = ( state ) => {
    return {
        email: state.auth.email,
        password: state.auth.password
    };
};

export default connect (mapStateToProps, { emailChanged, passwordChanged, loginUser })(LoginForm);

Действия index.js

export const loginUser = ({ email, password }) => {
    console.log("Shikher1");
    return (dispatch) => {
    firebase.auth().signInWithEmailAndPassword( email, password ).then( user => {
        dispatch ({ type: 'LOGIN_USER_SUCCESS' , payload: user });
    });
    };
};

Ничто не упоминается в редукторе как таковом, я просто хотел убедиться, что действие запускается и выполняется асинхронный вызов. Но здесь ничего не происходит. Как я напечатал из console.logs, я вижу, что функция обратного вызова выполняется, и она также вызывает создателя действия, но оператор firebase не выполняется, так как после выполнения он возвращает объект. Почему оператор firebase не выполняется?

Где я здесь не так?

Answer 1

в вашем LoginForm.js, попробуйте добавить эти строки

const mapStateToProps = ( state ) => {
    return {
        email: state.auth.email,
        password: state.auth.password
    };
};

const mapDispatchToProps = dispatch => ({
    emailChanged: payload => dispatch(emailChanged(payload)),
    passwordChanged: payload => dispatch(passwordChanged(payload)),
    loginUser : payload => dispatch(loginUser (payload))
})

export default connect (mapStateToProps ,mapDispatchToProps )(LoginForm);