涉及API调用的具有本地状态的Redux状态

Question

我遇到了有趣的文章（帖子末尾的链接）。该文章的作者指出，他们将redux存储视为客户端数据库，并且UI逻辑不适合那里（如果不相关的组件不需要），即使是为了获取数据。例如，我们想要在获取一些数据时显示一些加载微调器：

async componentDidMount() {
  this.setState({isLoading: true});
  await this.props.fetchSomeData();
  this.setState({isLoading: false});
}

我们触发异步thunk动作，它获取多个组件所需的一些数据，或者我们想要缓存该数据，即使卸载该组件也是如此。

关注加载状态的唯一组件是我们触发thunk动作的组件，其他组件不关心加载状态。但我总是看到带有异步动作创建器的redux示例，它们会激活REQUEST / SUCCESS / FAILURE动作类型，并且即使它们在一个组件中使用，也会使用加载状态来减少。

我可以看到这些代码的一些缺点，一些状态存在于组件中，一些存在于redux中，但优点是redux存储不会因其他组件不需要的状态而膨胀，我们也可以避免redux的冗长

所以我的问题是，对于这个特定的例子，这种状态分离的缺点是什么？

文章：https://dev.bleacherreport.com/3-things-i-learned-about-working-with-data-in-redux-5fa0d5f89c8b （文章评论中也有趣的讨论）

Answer 1

IMO，你的州分离方法的一些缺点是：

1. 如果场景后面有复杂的API提取（获取A然后获取B然后获取C）redux-thunk将是不适当的，您将不得不使用redux-saga或redux-observable与他们一起，REQUEST / SUCCESS / FAILURE风格。

2. 如果将来有其他组件需要聆听“加载”。状态或更糟的需要相同的数据，但不能保证显示它们的顺序是相同的（一个挂载和获取数据，然后在获取数据之前进行B挂载，再次取回B），你将不得不重构所有数据结构。当你需要取消取件时，这并不算数。

3. 如果您的组件在获取数据之前卸载，则＆＃34; this.setState＆＃34;调用将导致空引用错误。

一般情况下，我同意UI状态应放在组件中，但全局状态必须始终存储在Redux存储中，而isLoading不是完全是UI状态，而是您的请求的状态组件正在听。