反応-Reduxの状態の変化を、ないページを再レンダリング

 

1.通報しますか？

在redux中，通过reducer来对state的进行更新，但是我在reducer中改变了state的值，但是页面没有重新渲染，并且在控制台输出显示state的值已经改变

コード：

const initStore = [
    {
        name: 'lili',
        blogTitle: 'nihao',
        blogContent: 'nihao',
        nowTime: '2016-4-10'
    },
    {
        name: 'bob',
        blogTitle: '你好！',
        blogContent: '你好！',
        nowTime: '2016-5-15'
    }
];
export default function (state = initStore, action) {
    switch (action.type) {
        case 'DELETE':
            state.splice(action.index,1);
            console.log('state:',state);//输出state的值已经改变
            return state;
    }
}

2.の理由

reducer 就是一个纯函数，接收旧的 state 和 action，返回新的 state。保持 reducer 纯净非常重要。

内部の減速でこれらの操作を行うことはありません。

修改传入参数；
执行有副作用的操作，如 API 请求和路由跳转；
调用非纯函数，如 Date.now() 或 Math.random()。

現在の状態と処置：ストアは、2つのパラメータの減速を渡します、あなたが直接、状態の値を変更することはできませんので、Reduxのは、古いものと新しい状態を比較します、直接状態も店の内装を変更し、その後、古いものと新しい状態に変更はありません修正つながります。ページは、再レンダリングをしません。

3.ソリューション

• 状態を変更しないでください。使用して、Object.assign()コピーを構築しました。

例

function todoApp(state = initialState, action) {
  switch (action.type) {
    case SET_VISIBILITY_FILTER:
      return Object.assign({}, state, {
        visibilityFilter: action.filter
      })
    default:
      return state
  }
}