老师好，关于redux的结果
来源：9-7 【中间件】使用redux-thunk中间价实现异步action
袁门弟子
2023-09-26
老师好，我理解了redux的执行过程，以及配合thunk来操作异步，但是有一个点我不是很明白：
以前我们写vue代码的时候，就是直接在vue文件内执行http请求，然后我们就拿到结果啦，可以进行判断，然后对页面进行其他操作（比如ajax执行删除后更新列表、删除后关闭弹窗）
但是如果在redux-thunk的时候，如下图
您看：我们的thunk是返回一个函数，我只能在函数内进行结果判断，来进行删除成功后的操作，这里我把删除后的列表更新放在了成功的then里，但是有一个问题：我如果想在删除成功后关闭弹窗/失败不关闭弹窗，这个弹窗的操作逻辑在.tsx文件里，并没有在reduce的这个文件内，这时候我该怎么做呢？
我曾经想过利用deleteHotCreater（上图中的thunk函数）的返回值来判断，但是我想了想，返回值是一个fn，此时页面中拿到的时候还未执行，所以不行。而页面中dispatch这个action函数，会执行reducer函数，在页面中也拿不到结果。
react-redux，我们一般是将异步放在redux中执行，但是我们往往需要异步的结果来判断页面的一些逻辑执行，这个时候我如何高效的得到结果呢？
还有一个办法就是state中设置一个值，页面通过useSelect，也就是通过监听state值来判断执行结果，但是这样似乎有点麻烦，老师请问比较标准，或者说比较好的有什么解决办法呢？谢谢。
写回答
1回答
-
阿莱克斯刘
2025-01-23
这个问题确实是在使用Redux进行异步操作时的一个常见困惑。为了解决这个问题，有几种方法可以考虑：
### 1. 使用Thunk Action Creators的返回值
虽然Thunk Action Creators默认返回的是一个函数，但是你可以在dispatch这个函数之后，对其进行链式调用。关键在于，返回一个Promise对象以便在组件中处理异步结果。
### 2. 使用中间件处理异步
你也可以使用redux-saga或redux-observable这些中间件来更好地处理复杂的异步逻辑和副作用。
### 3. 使用状态监听
虽然通过状态监听有时看起来有点麻烦，但它确实是标准的Redux方法。你可以将异步操作的状态存储在Redux中，然后使用`useSelector`监听状态变化。
这几种方法都可以帮助你更高效地处理异步操作，并根据结果来更新组件状态。希望这些方法能解决你的问题。00
相似问题