Question

我在RN应用程序中使用Redux。如何在用户登录时重定向用户？我应该把代码放在哪里：ActionCreator还是Reducer？对不起，非常新手（ps：我知道auth正在使用console.log）

这里是动作创作者

export const loginUser = ({email, password}) => {
  return (dispatch) => {
    Meteor.loginWithPassword(email, password, (error) => {
      if (error) {
        console.log('erreur dans le sign in')
        return dispatch ({type: LOGIN_USER_FAIL, payload: email});
      } else {
        console.log('pas d erreur dans le signin')
        return dispatch({type: LOGIN_USER_SUCCESS, payload: email });
      };
    });
  };
};

AuthReducer

export default (state= INITIAL_STATE, action) => {
  //console.log(action);
  switch (action.type) {
    case EMAIL_CHANGED:
      console.log('Changed!')
      return {...state, email: action.payload}; // {...state} => so the object is updated

    case PASSWORD_CHANGED:
      console.log('password changed')
      return{...state, password: action.payload};

    case LOGIN_USER_FAIL:
      console.log('from login user fail reducer');
      return {...state, email:'fail'};

    case LOGIN_USER_SUCCESS:
      console.log('from login user success reducer');
      return {...state, email:'success'}

    default:
      return state;
  }
};

Answer 1

就个人而言，我根据动作创建器中的API请求等结果处理路由。

确切的方法取决于您使用的路由器。

export const loginUser = ( {email, password, navigator})=>{

    return (dispatch)=>{
          Meteor.loginWithPassword(email, password, (error) => {
          if (error) {
            console.log('erreur dans le sign in')
            return dispatch ({type: LOGIN_USER_FAIL, payload: email});
          }else{
            console.log('pas d erreur dans le signin')
            dispatch({type: LOGIN_USER_SUCCESS, payload: email });

            // Route to new location
            return navigator.replace(Router.getRoute('accounts', { fromLogin: true }))
          };
        });
    };
};

Answer 2

进行重定向的最佳位置将在您的动作创建者中。
因为只有在登录成功的瞬间触发它，代码才会更清晰。

export const loginUser = ({email, password}) => {
  return (dispatch) => {
    Meteor.loginWithPassword(email, password, (error) => {
      if (error) {
        console.log('erreur dans le sign in')
        return dispatch({type: LOGIN_USER_FAIL, payload: email});
      } else {
        console.log('pas d erreur dans le signin')
        // Your code to redirect
        return dispatch({type: LOGIN_USER_SUCCESS, payload: email});
      };
    });
  };
};

在你的reducer中不是一个好主意，因为它的目的只是处理de app状态。

另一种选择是在您请求登录的组件中进行重定向。

componentWillReceiveProps (nextProps) {
  if (nextProps.email === 'success') {
    // Your code to redirect
  }
}

在RN app中使用Redux进行反应导航

2 个答案: