Question

我正在使用react redux构建一个包含大量CRUD的仪表板应用程序。因此，对于数据库中的每个集合，我都有自己的页面。

问题在于我们每个人都会制作一个动作，缩减器和一个常量文件，每个都会有类似的操作，如 fetch，fetchSuccess，fetchError，insert，insertSuccess，insertError，remove，removeSuccess， removeError，clearInsertError，clearRemoveError。 这是正确的方法吗？我觉得它不是很有效，因为我必须在不同的文件中反复写常量

Answer 1

一种常见的方法是使用一个collections reducer，并创建将集合名称作为参数的操作（例如GET_COLLECTION），并将该集合作为键存储在其名称下。然后可以将常量简化为单个文件，该文件将集合列为字符串 - 也许是端点的URL的子路径。

作为一个例子，假设我们有一组Cars对象和一组轮胎，分别在/api/cars/和/api/tyres/提供。您可以将这些路由的常量定义为CARS = 'cars/'和TYRES = 'tyres/'，然后在存储状态时，完整集合reducer可能如下所示：

const state = {
    collections: {
        CARS: [/*list of cars*/],
        TYRES: [/*list of tyres*/],
    }
}

我们可能想要获取所有汽车：我们可以使用类似getCollection(CARS)的内容，然后我们应该期望reducer将结果存储在state.collections[CARS]下。

编辑：关于回复 -

当存储响应状态，而不是使用数组（或列表）来存储每个集合时，您可以改为使用具有两个键的对象 - response和items。应使用与获取集合相同的操作更新response对象 - 发送请求时应将其设置为“PENDING”，然后如果获得成功响应则设置为“SUCCESS”或“如果请求失败，则失败。如果请求失败，这也是存储错误的地方。

另一种常见模式是保持缩减器结构，如上所示，并为响应状态创建单独的缩减器。同样，这将响应与集合reducer相同的操作，并将每个集合的响应状态存储在对象中，您可以在其中保留有关请求和任何错误的信息。

使用react redux进行大量CRUD的编码风格

1 个答案: