在我的redux-saga应用中,可能同时发生多个api调用,因此需要显示各个加载程序和api响应成功/错误消息。
如何处理这种情况?
例如,通常保持以下redux状态:
{
data : {},
isError: false,
isLoading: true
}
当api调用正在等待响应时,此处isLoading
标志变为true。
[isError
标志在api响应返回错误时变为true。
[data
存储来自api的成功响应
当没有同时进行api调用时,上述方法可以正常工作。
如何同时发生不同的api调用时如何处理?
对于这种情况:
而不是全局使用状态
{
data : {},
isError: false,
isLoading: true
}
我们可以单独使用状态
像在每个不同的api调用中一样,我们可以使用不同的reducer,并且可以分别设置isError和isLoading的不同reducers。
现在在rootReducer中,我们以不同的方式分配所有的reducer,例如responseOfApi1,responseOfApi2等,我们可以在组件中像props.responseOfApi1,props.responseOfApi2一样访问它。
现在我们可以将isLoading定义为单个组件中的状态,并检查是否有任何props.responseOfApi1.isLoading || props.responseOfApi2.isLoading,那么我们可以setState({isLoading:true}),如果props.responseOfApi1.isLoading && props.responseOfApi2.isLoading setState({isLoading:false})