首页 文章

为什么我的User.props总是未定义? React-Native和Redux

提问于
浏览
2

我正在使用React-Native和Redux .

我需要在动作后访问react redux上的用户状态 . 我在我的组件 (console.log(this.props.User)) 上执行操作后使用简单的console.log尝试此操作,但它始终未定义 .

This is my Combine Reducer:

import { combineReducers } from 'redux'; import User from './userReducer';

export default combineReducers({
    User });

This is my User Reducer:

import {
    REGISTER_USER,
    SIGNIN_USER } from '../types';

export default function(state=INITIAL_STATE, action){
    switch(action.type){

       case  SIGNIN_USER:
       return {
        ...state,
        userData:{
                 uid: action.payload.localId || false,
                 token: action.payload.idToken || false,
                 refreshToken: action.payload.refreshToken || false,
        }
    };
    break;

        default:
            return state
    } }

This is my action:

export function signIn(data){
    const request = axios({
        method:'POST',
        url:SIGNIN, 
        data:{
            email: data.email,
            password: data.password,
            returnSecureToken:true 
        },
        headers:{
            "Content-Type":"application/json"
        }
        }).then(response => {
            return response.data
        }).catch( e=> {
            console.log(e)
        });

    return {
        type: SIGNIN_USER,
        payload: request
    }
}

Component where I try to get the state after action:

import { connect } from 'react-redux';
import { signIn } from '../Store/Actions/userActions';
import { bindActionCreators } from 'redux';


class LoginComponent extends React.Component {


 state = {
    email:'',
    password:''
  };

      signInUser () {

        try {
          this.props.signIn(this.state).then( () => {
           **console.log(this.props.User)**
          })
        } catch (error) {
          console.log(error)
        }
      }

}

const mapStateToProps = (state) => {
  return{
    User: state.User
  }
}

const mapDispatchToProps =( dispatch ) => {
  return bindActionCreators({signIn}, dispatch)
}

export default connect(mapDispatchToProps,mapDispatchToProps)(LoginComponent);

The response on log just is: undefined

我的错是什么?谢谢!

1 回答

  • 0

    您传递给 connect 方法的参数的顺序是错误的,它首先需要 mapStateToPropsmapDispatchToProps 作为第二个参数 . 所以你的代码必须是 export default connect(mapStateToProps, mapDispatchToProps)(LoginComponent);

    这是签名

    connect([mapStateToProps], [mapDispatchToProps], [mergeProps], [options])
    

相关问题