javascript - 为什么Redux中state改变需要这么来能进行同步?请问有什么更好的方法来避免吗?

问题描述

问 题

function cloneState(state) {
  return JSON.parse(JSON.stringify(state));
}

export default function rootReducer(state = dataModule,action = {}){
  state = cloneState(state);
  switch (action.type){
    case 'REDUX_TEST':
      state.config= ++state.config;
      break;

  }
  return state
}

如题.上面的代码是reducer的部分,如果不加jsong.stringify,mapStateToProps方法就不能奏效,能不能说下产生这个的原因?

我先说说我的看法,我觉得它是因为JavaScript里面对象的赋值是引用造成的,但是想不明白,为什么引用的过程中改变原对象中的数值,在引用后的对象上就看不到了

解决方案

感觉楼主这里有误区，说说我的理解，看看是不是楼主想问的:P
在redux中，reducer是纯函数，需要返回一个全新的对象才会触发redux对state的修改，如果是在原对象上进行修改则无法触发，因为redux会先比较前后两份state的引用，相同就return啦。所以这里JSON.parse(JSON.stringify(state))的语法，无非也是通过这种怪怪的方式另外克隆了一份state数据。
我的建议是这里使用es6 object.assign的语法

case 'REDUX_TEST':
      return Object.assign({},state,{config:state.config++});
      break;

或者用lodash的clone或者assign函数。

这篇关于javascript - 为什么Redux中state改变需要这么来能进行同步?请问有什么更好的方法来避免吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！