Redux没有在商店更新上调用mapStateToProps

时间:2019-02-08 12:05:02

标签: reactjs redux react-redux

在更新状态时请勿使用push。使用concat

我正面临着这个非常奇怪的问题,请考虑使用减速器:

export default function(state = null, action) {

  console.log("Current State: ",state);
  // on performing actions, it gives me:
  // Current State: null
  // Current State: Array [{}]
  // Current State: Array [{}] -- all good

  if(state === null) {
      state = [
          {id: 1, title: "Java"}
      ];
  }

  // UPDATED PART. FORGOT TO MENTION IT BEFORE
  if(Action.type == "UPDATE_LIST") {
     state.push( Action.payload ); // don't do that, this'll mutate your array and states are immutable
  }
  /////////////

  return state; // this is the main problem
}

以上代码未在我的组件内调用mapStateToProps。但是,像下面这样修改上面的reducer会调用mapStateToProps

return []; // instead of return state;

OR

return [ {id: 1, title: "Python"} ]; // instead of return state;

在两种情况下,我都将返回Array的instanceof [state&[]],但是只有后者在我的组件中调用mapStateToProps

这很奇怪,我不知道该怎么解决这个问题。

2 个答案:

答案 0 :(得分:2)

redux的目的是确保您的状态不直接可变。由于数组和对象是通过JavaScript引用传递的,因此您的代码正在尝试直接更改状态对象。这是不正确的。

总是通过返回新状态来改变状态。像这样:

export default function(state = null, action) {
  let newState = [...state];
  if(state === null) {
      newstate = [
          {id: 1, title: "Java"}
      ];
  }

  return newState;
}

答案 1 :(得分:1)

这样做:

 if(state === null) {
      state = [
          {id: 1, title: "Java"}
      ]; 
      return state;
  }

  return state;