iceoyb / log

什么都可以丢这,随意记就好
0 stars 0 forks source link

redux源码过程 #3

Open iceoyb opened 6 days ago

iceoyb commented 6 days ago

Q:what,why,how A: redux是一个全局状态管理库 为了方便用户更好的管理大量的数据,以及类似react对数据的有精确的管控要求的场景,就需要用户能很好地管理这些数据。 redux对业务层(使用)的话,主要关注store和dispatch,store是用来取数据的,dispatch是用来更新数据的。我们需要在业务层对组件增强(引入)store-取数据和action-修改数据。--比如通过在顶层节点引入store,通过传值,在子孙组件connect去引入store中的数据或修改store数据的action

iceoyb commented 5 days ago

为什么redux经常需要跟immer结合起来用? 因为redux提供的combination方法判断数据是否改变用了!==来比较数据是否修改来决定是否替换新的state数据。 在我们修改引用数据类型的时候浅比较是会直接比较内存地址导致这个代码出问题的。 代码如下:

  return function combination(state = {}, action) {
    ...
    let hasChanged = false
    const nextState = {}
    for (let i = 0; i < finalReducerKeys.length; i++) {
      const key = finalReducerKeys[i]
      console.log('key:',key)
      const reducer = finalReducers[key]
      const previousStateForKey = state[key]
      const nextStateForKey = reducer(previousStateForKey, action)
      if (typeof nextStateForKey === 'undefined') {
        const errorMessage = getUndefinedStateErrorMessage(key, action)
        throw new Error(errorMessage)
      }
      nextState[key] = nextStateForKey
     //此处
      hasChanged = hasChanged || nextStateForKey !== previousStateForKey
    }
    return hasChanged ? nextState : state
  }