Question

是否有可能创建一个Promise，一旦全球vuex存储中的变量发生更改，它就可以解决？

我在状态存储区中有一个初始化为null的变量，并将通过异步调用进行填充。
应用程序的不同部分取决于该变量是true还是false，并且应该在它仍然null时等待。

是否有一种方法可以干净地等待此变量的更改？

Answer 1

您可以先在表达式或函数上vm.$watch，然后再wrap that with a promise。

function watch(vm, fn) {
  return new Promise(resolve => {
    const watcher = vm.$watch(fn, (newVal) => {
      resolve(newVal);
      watcher(); // cleanup;
    });
  });
}

这将使您可以执行以下操作：

let change = await watch(vm, () => state.foo); // will resolve when state.foo changes

在async function内部。

请注意，通常这不是一个了不起的模式，在大多数情况下，为此使用computed property（而不是诺言）是更可取的。

Answer 2

类似于本杰明的回答，而不是您所要求的，只是另一种选择。您可以 subscribe 到发生特定类型的突变时，而不是观察状态变化，并将其包装到 Promise 中。

new Promise(resolve => {
      let unsubscribeFn = this.$store.subscribe(mutation => {
        if (mutation.type === "MY_MUTATION") {
          unsubscribeFn();
          resolve();
        }
      });
    });

VueJS Vuex-解决状态变化的承诺？

2 个答案: