变异后VueX Getter没有运行

Posted 2023-02-22

【中文标题】变异后VueX Getter没有运行

【英文标题】：VueX Getter not running after Mutation

【发布时间】：2020-05-26 16:31:47

【问题描述】：

我已经连接了 VueX，并且 Mutations 工作正常，但是，Getter 方法没有再次运行。我在不使用 TS 类组件语法的情况下将 VueJS 与 TypeScript 一起使用。

我的代码如下：

export default new Vuex.Store(
  state: 
    Started: false
  ,
  getters: 
    getStarted(state): boolean 
      console.log(state.Started)
      return state.Started;
    
  ,
  mutations: 
    setStarted(state, payload): void 
      console.log("mutated", payload)
      state.Started = payload;
    
  ,
  actions: 
  ,
  modules: 
  
)

我正在正确地提交子组件中的突变

emitStartedClicked(): void 
  console.log("from child clicked");
  this.$store.commit("setStarted", false);

我像这样在父组件中听 getter：

computed: 
    getStarted(): void 
      console.log("gottem");
      return this.$store.getters.getStarted;
    
  

我在子组件单击按钮时触发突变，并希望在其父组件的计算属性中执行 getter。

我的控制台输出如下：

如您所见，在初始页面加载时，计算属性中的 getter 似乎正在工作，但是，在触发突变的按钮单击之后，getter 没有更新。 这里有什么问题？

谢谢

【问题讨论】：

你试过设置 state.Started 到 false 以外的东西吗？

不，我为什么要这样做？

哦，它起作用了...我将其设置为 true 并且它起作用了

很高兴听到。开始是错误的，然后 this.$store.commit("setStarted", false);只需将其更新为 false

我现在明白了，getter 没有触发，因为我将 state 初始化为 false 并且在我的突变中也将其设置为 false ......所以我想有一些 VueX 逻辑没有'如果状态的值没有改变，则触发 getter

【参考方案1】：

您是否尝试过将 state.Started 设置为 false 以外的内容？

一开始是假的，然后 this.$store.commit("setStarted", false);只需将其更新为 false