时间戳

首页 > 解决方案 > 变异后VueX Getter没有运行

javascript - 变异后VueX Getter没有运行

问题描述

我已经连接了 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 没有更新。这里有什么问题？

谢谢

标签： javascripthtmltypescriptvue.jsvuex

解决方案

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

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

推荐阅读