将一个专门用于实体创建的Redux状态分配给“即发即忘”是一个好习惯吗? API?

时间:2018-04-27 11:03:14

标签: reactjs asynchronous redux architecture cqrs

在几个博客视频等中,有一个使用Redux的CRUD教程。

他们都没有(冲浪后的AFAIK)在服务器上处理完全异步API,例如即发即弃行为。
CQRS 环境中的主要命令经常处理那些即发即弃的问题。

让我们通过Twitter的一个虚构示例来轻松获得这个想法:

基本上,在同步 CRUD API 的上下文中,您可能有:

  • Redux操作: POST_TWEET
  • 服务器API:在响应数据中返回整个创建的推文。
  • 状态: TweetReducer 从响应中探索并存储创建的推文数据。
  • UI:直接从 Tweet 状态收听新推文。

除了经典的提取API之外, TweetReducer 可以完全处理 POST_TWEET 操作,因为它可以直接包含新的推文。

但是,在服务器上发生了“即发即弃”API的情况下:

  • Redux操作: POST_TWEET
  • 服务器API:仅在响应中返回推文的ID(例如位置)。
  • 状态: TweetReducer 无法处理创建,因为在成功操作触发时推文不可用。
    因此,一个新的Redux状态专门用于处理标记为 TweetCreation 的推文,通常拥有这些属性:(data: {id: string}, inProgress: boolean, errors: [])。
    然后,它会在数据中获取新创建的推文ID,并允许UI听取此状态( TweetCreation )。
  • 用户界面:收听TweetCreation状态,因此会显示发送推文,甚至尝试按某个时间间隔获取服务器以获取完整的推文。

有些人尝试在Redux商店添加另一个状态来处理即发即弃的API ,这是一个好习惯吗?

是"传统"在社区还是有另一种聪明的方式?

1 个答案:

答案 0 :(得分:1)

1。为待处理的推文创建单独的状态

首先,您需要将TweetCreation更改为数组,以防用户在确认第一条推文之前发送第二条推文。

所以你的形状看起来像这样:{ pendingTweets: [], confirmedTweets: [] }

POST_TWEET中,您将新推文附加到pendingTweetsSET_TWEET_ID中,您从pendingTweets中移除匹配的推文并将其推送到confirmedTweets

在您的组件中,您可能会执行confirmedTweets.concat(pendingTweets).map(...)

之类的操作

2。对待处理的推文使用相同的状态

形状只是{ tweets: [] }

POST_TWEET中,您将新推文附加到tweetsSET_TWEET_ID中,您可以在tweets更新匹配的推文。

在您的组件中,您执行tweets.map(...)

结论

对待处理的推文使用相同的状态似乎是一种更简单(因此更好)的方法。

其他考虑因素(两种方法)

  • 我遗漏了有关在更新时避免直接状态突变的详细信息,因为这非常基础。
  • 您可能需要执行以下操作:为待处理的推文生成临时ID并将其从服务器发回,以便您可以在SET_TWEET_ID中找到匹配的推文。
  • 临时ID可以使用不同的对象键(或使用其他标志),以便您可以区分组件中的待处理和已确认的推文(例如,在待处理的推文旁边呈现加载图标)。
  • 使用id作为对象键替换[] {}可能会更好(取决于具体要求),但这不是此问题的重点。