我想知道我是否正确理解了 React 或 React-Native 中 Redux-thunk 异步操作的模式，以及我们如何对操作状态进行用户反馈。
我觉得要么我不理解模式，要么还有其他拼图。
所以，在我的 React 原生应用程序中（但它也可以用于 React），我想调用一个更新 REST 调用，它将返回一个承诺。如果成功或失败，我想相应地向用户显示一条消息。
没有 Redux-async，我只是调用其余的，并处理 promise。
callServiceUpdate(data).then(() => displaySuccessMessage())
.catch(() => displayErrorMessage());
在 Redux 训练中，当我们做 async 时，我们只是 dispatch 一个 action，这个 action 会调用异步操作。
所以，在我们定义动作的动作文件中：
// in file databaseActions.js
export function updateStatusAction(isSuccess, errorMessage) {
return {
type: 'UPDATE_STATUS',
isSuccess,
errorMessage };
}
export function UpdateAction(data) {
return (dispatch) => {
callServiceUpdate(data)
.then(() => dispatch(updateStatusAction(true)))
.catch((error) => dispatch(updateStatusAction(false, error)));
}};
并且分派动作将调用服务。
然后我们调度 updateStatusAction，它将更新 redux state，并通过 props 更新组件。
那么如何将成功的结果返回给用户呢？是通过 props 和处理 componentWillReceiveProps 吗？
是不是太复杂了？或者有更简单的方法来为用户提供反馈？
在我对这个主题做了一些研究之后，并搜索了人们是如何解决这个问题的。
我发现处理 Ajax 的常用模式是我在问题中提到的。但是，用户对ajax调用状态的反馈只发生在UI中的一个地方，在根组件容器中，或者在包含所有进行ajax调用的子组件的任何父组件容器中。
如果您需要阅读有关如何设计 UI 以适应良好的 React UI 设计良好实践的更多信息，请阅读代表性组件和容器组件
React + Redux 中处理 Ajax 调用的常用模式如下：
发送指示查询或 Ajax 调用已启动的操作。
发送将启动 Ajax 调用的操作。
收到来自 Ajax 的结果后，发送一个 Action for SUCCESS 或 FAILURE。
这些是此类行动的例子
{ type: 'FETCH_POSTS_REQUEST' }
{ type: 'FETCH_POSTS_FAILURE', error: 'Oops' }
{ type: 'FETCH_POSTS_SUCCESS', response: { ... } }
在 Reducers 方面，您需要有一个 Status 的三个部分来指示 Ajax 请求正在运行（以显示忙碌指示器）
商店中的状态看起来与此类似
frontend: {
isFetching: true,
didInvalidate: false,
items: []
},
然后在根容器中，处理 isFetching 以呈现繁忙的指示器。
并处理项目以显示结果，或显示错误
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句