vue.js - 如何禁用 vuex getter 缓存？

Question

我知道您可以通过包含 cache: false 选项来禁用 Vue 计算属性 中的缓存。例如:

computed: {
  now: {
    cache: false,
    get() {
      return Date.now();
    }
  }
}

但我想知道这个功能是否适用于 Vuex getters

Answer 1

要“禁用”缓存，您可以利用以下事实:用作函数的 getter 不会被缓存。

来自 the vuex docs

Note that getters accessed via methods will run each time you call them, and the result is not cached.

如果您不介意在访问非缓存属性时添加括号(实际上是调用函数)，您可以使用如下内容:

getters: {
  myNonCachedGetter: state => () => {
    // original getter body
  }
}

然后用作 myNonCachedGetter()。

事实证明，以下内容在较新版本的 vuex 中不起作用。

但是，如果您希望它看起来像一个普通的 getter，您可以通过调用将它包装到一个函数中:

getters: {
  myNonCachedGetter: state => (() => {
    // original getter body
  })()
}

它确实让代码看起来有点难读，但它可以像 myNonCachedGetter 一样简单地调用。