如何在React Redux应用程序中显示加载指示器，同时获取数据？
我是React/Redux的新手。我使用Redux应用程序中的fetch api中间件来处理api。是(redux-api-middleware)。我认为这是处理异步api操作的好方法。但是我发现了一些我不能自己解决的案例。
正如主页(Lifecycle)所说，fetch API生命周期以分派CALL_API操作开始，以分派FSA操作结束。
因此，我的第一个案例是在获取API时显示/隐藏预加载器。中间件将在开始时分派FSA操作，并在结束时分派FSA操作。这两个动作都是由reducers接收的，它应该只进行一些正常的数据处理。没有UI操作，没有更多的操作。也许我应该将处理状态保存在状态中，然后在存储更新时渲染它们。
但如何做到这一点呢？整个页面上的react组件流？从其他操作更新存储会发生什么情况？我的意思是，他们更像是事件而不是国家！
更糟糕的是，当我必须在redux/react应用程序中使用本机确认对话框或警报对话框时，我该怎么办？它们应该放在哪里，动作还是减速器？
谨致问候!希望回复。
回答 4
Stack Overflow用户
发布于 2016-02-26 18:08:04
丹·阿布拉莫夫回答得很好！我只想补充说，我在我的一个应用程序中或多或少地做到了这一点(将isFetching保留为布尔值)，最终不得不将其设置为整数(最终读取为未完成请求的数量)来支持多个并发请求。
使用布尔值：
请求%1启动->旋转器->请求%2启动->请求%1结束->旋转器关闭->请求%2结束
使用整数：
请求%1启动->请求的->旋转器请求%2启动->请求%1结束->请求%2结束->旋转器关闭
case REQUEST_POSTS:
return Object.assign({}, state, {
isFetching: state.isFetching + 1,
didInvalidate: false
})
case RECEIVE_POSTS:
return Object.assign({}, state, {
isFetching: state.isFetching - 1,
didInvalidate: false,
items: action.posts,
lastUpdated: action.receivedAtStack Overflow用户
发布于 2016-09-14 20:59:56
我是唯一一个认为加载指示器不属于Redux存储的人吗？我的意思是，我不认为它本身是应用程序状态的一部分。
现在，我使用Angular2，我所做的是我有一个“加载”服务，它通过RxJS BehaviourSubjects公开不同的加载指示器。我猜机制是一样的，我只是不把信息存储在Redux中。
LoadingService的用户只需订阅他们想要收听的事件。
每当需要更改时，我的Redux操作创建器都会调用LoadingService。UX组件订阅公开的可观察对象...
Stack Overflow用户
发布于 2016-02-17 20:59:15
您可以使用React Redux中的connect()或低级store.subscribe()方法将更改侦听器添加到存储中。您的存储区中应该有加载指示器，然后存储区更改处理程序可以检查和更新组件状态。然后，如果需要，该组件会根据状态呈现预加载器。
alert和confirm应该不是问题。它们是阻塞的，并且alert甚至不接受用户的任何输入。使用confirm，如果用户选择应该影响组件呈现，您可以根据用户单击的内容来设置状态。如果没有，您可以将选择存储为组件成员变量以供以后使用。
https://stackoverflow.com/questions/35456935
复制相似问题