从 Redux Observable 返回一个 Promise [英] Return a Promise from Redux Observable

问题描述

也许我在考虑这个错误，但我在 redux-thunk 中使用的一个常见模式是返回一个 promise，这样当某事完成或失败时，我可以在容器对象中执行一些额外的操作.

Maybe I'm thinking about this wrong, but a common pattern I use with redux-thunk is to return a promise so I can perform some additional actions in the container object when something completes or fails.

以 Thunk 为例:

Using Thunk as an example:

动作创建者:

const action = ({ data }) => (dispatch) => 
    fetch(`some http url`)
    .then(response => {
        if(response.ok) {
             return response.json();
        }

        return Promise.reject(response);
    })

连接组件中的某处:

this.props.action("Some Data")
    .then(console.log)
    .catch(error => console.error("ERROR"));

<小时>

在 Redux-Observable/Rxjs 中是否有一种干净的方法可以做类似的事情?基本上是从一个动作返回一个承诺，调用一个史诗，一旦可观察对象完成，它就会返回解决或拒绝.

---

Is there a clean way of doing something similar in Redux-Observable/Rxjs? Basically returning a promise from an action, calling an epic, that returns resolve or reject once the observable is complete.

推荐答案

一般来说，在使用诸如 redux-observable/redux-saga 之类的东西时，我会尽量让人们远离这些模式.相反，如果您正在等待为更新 store 状态而调度的操作，请依赖该状态更新本身或您的 reducer 存储在有关它的状态中的某种事务元数据.例如{ transactions: { "123": { isPending: true, error: null } }

Generally speaking, I try to shy people away from these patterns when using things like redux-observable/redux-saga. Instead, if you're waiting for an action you dispatched to update the store's state, rely on that state update itself or some sort of transactional metadata your reducers store in the state about it. e.g. { transactions: { "123": { isPending: true, error: null } }

但是，如果您真的想这样做，您可以编写(或使用现有的)中间件，从 dispatch 返回一个 Promise，当其他一些指定的动作已经发出(大概是你的史诗).redux-wait-for-action 就是一个例子(不是推荐，尽管原因是我没用过)

However, if you really do want to do it, you can write (or use an existing) middleware that returns a Promise from dispatch that will resolve when some other specified action has been dispatched (presumably by your epics). redux-wait-for-action is one example (not a recommendation, though cause I haven't used any)

请记住，Promises 通常是不可取消的，因此您可能会意外地创建这样一种情况:组件开始等待操作，用户离开该页面并且组件已卸载，而您仍在等待其他操作-- 这可能会导致稍后出现奇怪的情况，例如他们是否返回该页面等

Keep in mind that Promises are not normally cancellable, so you could accidentally create a situation where a component starts waiting for an action, the user leaves that page and the component is unmounted, and you're still waiting for that other action--which can cause weirdness later, like if they come back to that page, etc.

如果您正在等待连锁副作用，那属于您的史诗.启动史诗监听的单个动作，产生副作用，然后发出另一个动作以表示完成.另一个史诗监听完成动作，然后开始另一个副作用，等等.如果你愿意，你可以把它们全部放在一个单一的史诗中，但我发现分离更容易测试和重用.

If you're waiting to chain side effects, that belongs in your epics. Kick off a single action that an epic listens for, makes the side effect, then it emits another action to signal completion. Another epic listens for that completion action and then begins the other side effect, etc. You could put them all in a single monolithic epic, if you want, but I find the separation easier for testing and reuse.

这篇关于从 Redux Observable 返回一个 Promise的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！