更新状态的多个部分的 Reducer

Question

实际上，我每次更新state.thickness都需要更新state.litres。我怎么做？（我用 "state" 这个词来表示 redux store）

这是我的减速器：

export const thickness = (
  initialThickness: Map<*, *> = initialState.get('thickness'), 
  action: Object) => {
  switch(action.type) {
    case 'UPDATE_THICKNESS': {
      const litres = calcVol(action.payload.state)
      let newThickness = initialThickness
        .set('thickness' + action.payload.number, action.payload.value)
      return newThickness
    }
    default:
      return initialThickness
  }
}

litres 是我刚刚添加的东西，我想 return 它以及 newThickness - 这是我尝试更新 state.litres当我更新 state.thickness 时。

如果你能对此发表意见，加分：为了计算升，我需要访问整个状态（redux 存储）以传递给 calcVol(state)（计算和 returns以升为单位的体积）。是否像这样在 action 中传递整个状态，以便我可以在 reducer 中使用它，性能良好？还是有更高效的方式？

const mapDispatchToProps = (dispatch) => ({
  updateThickness: (text, number, state) => {
    dispatch(updateDimension('thickness', text, number, state))
  }
})

Answer 1

像这样的 reducer 不能同时更新 thickness 和 litres，因为它只能影响它负责的节点（在本例中为 thickness）。您可以：

将 reducer 上移一个级别并让它同时拥有 thickness 和 litres 节点，即 initialState = { thickness: 0, litres: 0 }
让 litres 减速器也处理 UPDATE_THICKNESS 动作类型并相应地更新 litres。

但是，您没有理由不能同时发送 'UPDATE_LITRES' 操作。如果你使用像 redux-thunk 这样的中间件，那么这就更容易了，因为你可以从同一个 thunk 中分派两者，而且它还可以消除在动作中传递整个状态的需要（我不会推荐，但没有数据支持。

const setThickness = (number, value) => {
    return (dispatch, getState) => {
        dispatch({ type: 'UPDATE_THICKNESS': payload: { number, value } })

        let litres = calcVol(getState())
        dispatch({ type: 'UPDATE_LITRES': payload: { number, value: litres } })
    }
}

希望对您有所帮助。

更新状态的多个部分的 Reducer

Reducer that updates multiple parts of the state

reactjs

react-native

redux

react-redux