reactjs - 问题 'state value is changed to undefined when Redux action is called'

Question

我在更改商店状态时遇到问题。
我想在login.js 中设置loggedIn 和storeNum 但是当我调用'changeLoggedIn(true)' 和'setStoreNum(1)' 时，之前调用的值被更改为undefined。

请给我建议将两个值一起设置而不是未定义。

谢谢你。



reducer.js

import { CHANGE_LOGGED_IN, SET_STORE_NUM } from './actions';

const defaultState={
    loggedIn: false,
    storeNum: 0,
  }
const loggedInReducer = ( state = defaultState, action) => {
  switch (action.type) {

    case CHANGE_LOGGED_IN:
      return{
        loggedIn: action.loggedIn
      }

    case SET_STORE_NUM:
      return{
        storeNum: action.storeNum
      }
    default: return state;
  };
};

export default loggedInReducer;

Action .js

export const SET_STORE_NUM = 'SET_STORE_NUM'


export const changeLoggedIn = (loggedIn) => ({
  type: CHANGE_LOGGED_IN,
  loggedIn: loggedIn,
});

export const setStoreNum = (storeNum) => ({
  type: SET_STORE_NUM,
  storeNum: storeNum,
})

login.js

export default connect(
    state => ({
        loggedIn: state.loggedIn,
        storeNum: state.storeNum
    }),
    dispatch => ({
        changeLoggedIn: (loggedIn) => dispatch(changeLoggedIn(loggedIn)),
        setStoreNum: (storeNum) => dispatch(setStoreNum(storeNum))
    })
)(Login);

Answer 1

那是因为你只返回 loggedIn为 CHANGE_LOGIN行动。

返回这个:

const loggedInReducer = ( state = defaultState, action) => {
  switch (action.type) {

    case CHANGE_LOGGED_IN:
      return{
        ...state,
        loggedIn: action.loggedIn
      }

    case SET_STORE_NUM:
      return{
        ...state,
        storeNum: action.storeNum
      }
    default: return state;
  };
};

希望这可以帮助!