Question

我现有mapDispatchToProps：

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

但我现在需要计算音量并在每次updateThickness时发送结果。基本上就是这个：

let litres = calcVol(getState())
dispatch(updateVolume(litres))

其中getState()是redux商店。这就是我添加redux-thunk的原因。我在redux-thunk中看到了一些mapStateToProps用法，但我的用例非常不同。

这是我尝试更新mapDispatchToProps：

const mapDispatchToProps = (dispatch) => ({
  updateThickness: (text, number) => {
    dispatch(updateDimension('thickness', text, number))
    let litres = calcVol(getState())
    dispatch(updateVolume(litres))
  }
})

getState()未定义，但因为我没有正确地合并redux-thunk。

如何将redux-thunk正确合并到mapDispatchToProps？

Answer 1

updateThickness没有使用redux-thunk。使用redux-thunk，动作创建者可以返回一个函数，该函数接收dispatch和getState作为参数。

所以试试这个：

updateThickness: (text, number) => (dispatch, getState) => {
  dispatch(updateDimension('thickness', text, number))
  let litres = calcVol(getState())
  dispatch(updateVolume(litres))
}

updateThickness也是一种行动创造者。通常我们将动作创建者分开：

const updateThickness = (text, number) => (dispatch, getState) => {
  dispatch(updateDimension('thickness', text, number))
  let litres = calcVol(getState())
  dispatch(updateVolume(litres))
}

你这样连接它：

connect(
  mapStateToProps,
  { updateThickness } // can be a plain object
)(YourComponent)

将redux-thunk合并到mapDispatchToProps中

1 个答案: