使复选框更具响应性本机redux

Question

我的应用程序中有复选框，并在用户检查/取消检查时更新其值。我通过调度动作通过redux执行此操作。

onChangeDetails: (serverReport, details) => {
  dispatch(editDetails(serverReport.uuid, details))
}

正在保存新值时，复选框点击有一个短暂的延迟。我想立即进行这项检查，没有滞后。

我知道我可以将值存储在状态中并向页面添加一个保存按钮，但我希​​望保持原样。我已经在其他应用中看到了这一点，但我不确定处理它的最佳方式。

Answer 1

  

我建议您可以使用local state和dispatch操作来检查/取消选中更新reducer即其他组件使用的全局状态。这样的事情，

onChangeDetails: (serverReport, details) => {
  //Use local state to update the UI to avoid lag.
  this.setState({
    checked: !this.state.checked
  })

  //Also dispatch action to update the reducer.
  dispatch(editDetails(serverReport.uuid, details))
}

这应该避免延迟，因为当您尝试通过调度操作来更新状态时，需要一些时间来改变状态。希望这会有所帮助。