Question

我是React的新手，正在编写无限滚动功能。

window.addEventListener( 'scroll', DutyActions.scrollDuties );

在每个滚动事件中，我调用操作scrollDuties，该操作从服务器获取数据。然后调用名为loadDuties的服务器操作将响应传递给商店，并将其广播到视图。

问题是，在快速滚动时，它会对API进行多次点击，因为第二次滚动事件会在setState({loading: true})语句在页面上呈现之前触发。我认为唯一的解决方案是读取操作中的状态，并仅在loading标志为false时才启动ajax。

这会违反Flux原则吗？

Answer 1

The Redux flavor of Flux handles this situation in the action elegantly by way of the redux-thunk middleware.在该范例中，动作创建者可以返回一个具有获取商店参数的函数。它的调度程序知道如何评估此函数，以便可以将存储暴露给操作，而不会在操作中创建显式的存储依赖项。

使用更多标准的Flux实现，为了实现相同的解耦，我相信您必须将store参数传递给组件中的操作。也许有些东西：

doScrollAction: function (scrollParam) {
  var isLoadingStore = IsLoadingStore.getAll()
  DutyActions.scrollDuties(scrollParam, IsLoadingStore)
}

window.addEventListener( 'scroll', doScrollAction );

在行动中访问状态是否违反了Flux原则？

1 个答案: