Question

我一直在使用React / Redux大约两年，但我目前参与了一个React应用程序，该应用程序使用Facebook的Flux而不是Redux进行状态管理。所以我开始阅读有关Flux和Redux的不同之处。我偶然发现了一些我不完全理解的东西，也许这里的某个人能够“讨论”＃34;这个问题！

在Facebook关于reduceStore减少方法的Flux文档中，他们说明了这种方法，这种方法应该是纯粹的，并且没有副作用＆＃34; （这听起来很像Redux中的reducer方法 - 纯函数）。但在他们自己的例子中：Flux async（https://github.com/facebook/flux/tree/master/examples/flux-async），他们引入了DataManager，它处理API调用。这个管理器在reduce方法中的示例中被调用。因此，他们自己的例子中的reduce方法会产生副作用，使其成为非纯函数。

这里的最佳做法是什么？你自己用了什么？这些杂质应该放在哪里？

My＆＃34; Redux＆＃34; -inspired方法是创建一个从视图调用的动作创建器（如Redux），此方法执行异步API调用，然后调度操作。因此，澄清我的方法会将提取逻辑（副作用）从商店中删除，转而采用某种动作创建方法。

sudo代码中的动作创建者看起来像这样：

getSomedata(param){
    dispatch({type: GET_SOME_DATA_FETHCING})
    doApiCallAsync()
    .then( () =>{dispatch({type: GET_SOME_DATA_SUCCESS, result: json.result})})
    .catch( () =>{dispatch({type: GET_SOME_DATA_FAILURE})})
}

Answer 1

与Redux不同，Flux并不限制您处理异步操作的方式。最佳做法可能不存在;这取决于开发者的口味。这是Flux中的官方异步示例：https://github.com/facebook/flux/tree/d95f9b9a06a24ccc8ba6b5742759ea3a383f20c9/examples/flux-async

如您所见，它会在商店中通过TodoDataManager调用API，例如this line或this line;它没有使用动作创作者。在TodoDataManager中，它也会发送行动。就个人而言，我并不喜欢这种做法，或者......让我们说我不喜欢Flux。

事实上，我正在将Flux应用程序迁移到Redux。旧的Flux应用程序使用类似的方法，它使用事件发射器来通知组件有关存储更改的信息。代码库很乱。

如果我必须使用flux，我将使用与您相同的方法，这样可以清楚地分离责任并使代码库更容易推理。但是如果可以选择迁移到Redux，我会选择Redux。

使用React在Flux架构中进行异步调用时的最佳实践是什么？

1 个答案: