Question

我们正在使用React和Redux库编写应用程序。

在前端，我们有一个React组件，允许向用户添加/删除汽车品牌 例如：

bob: Toyota/Nissan/Chevrolet
tony: Toyota/BMW/Audi

每个品牌都有一些自定义参数，因此汽车品牌可以是：

ADDED
改性
REMOVED 来自特定用户

我们有一个Redux状态，其中包含每个用户的当前品牌列表：

{
    brands_per_user:
    {
        bob: [Toyota,Nissan,Chevrolet],
        tony: [Toyota,BMW,Audi],
    }
}

在后端，我们有RESTful端点接受GET / POST / PUT / DELETE操作：

{toyota,nissan,chevrolet}  ->   /api/users/bob/       
{toyota,bmw,audi}  ->            /api/users/tony/

我们有一个保存按钮，可以将当前的Redux状态保存到我们的后端。因此，当按下保存时，应触发必要的CRUD操作以APPEND / MODIFY / REMOVE每个用户的车辆。

使用Redux是否有一种流行且简单的方法来实现这一目标？

我们当前的方法很麻烦，就是在Redux状态下创建3种密钥：

{
    brands_per_user:
    {
        bob: {
            added:  [Toyota, Chevrolet]
            modified:  [Nissan]
            deleted:  [Audi]
        },
        tony: {
            added:   [Toyota,Audi]
            modified:  [BMW]
            deleted:  [Nissan]
        },
    }
}

点击保存按钮后，我们会触发添加，已修改和已删除的每个部分的CRUD操作。这种方法适用于一个组件。我们的主要问题是，点击这个独特的保存按钮时，我们需要保存多个组件。

您有什么建议可以简化我们的方法吗？

Answer 1

有几种方法可以达到你想要的效果。您希望处理来自动作创建者的复杂（多步）异步API调用。这是两个突出的选择，可以帮助解决这个问题：

redux-thunk允许动作创建者返回承诺（或链式承诺）
redux-saga允许使用协程的复杂异步控制流

Redux状态下的批量CRUD操作

1 个答案: