使用Vuex模块装饰器和TS递增数值

npm install vue vuex

import { Module, VuexModule, Mutation, Action } from 'vuex-module-decorators';

@Module
export default class CounterModule extends VuexModule {
  private count: number = 0;

  get getCount() {
    return this.count;
  }

  @Mutation
  private increment() {
    this.count++;
  }

  @Action
  public async incrementCount() {
    this.increment();
  }
}

import Vue from 'vue';
import Vuex from 'vuex';
import CounterModule from './CounterModule';

Vue.use(Vuex);

export default new Vuex.Store({
  modules: {
    counter: CounterModule,
  },
});

<template>
  <div>
    <p>Count: {{ count }}</p>
    <button @click="incrementCount">Increment</button>
  </div>
</template>

<script>
import { mapGetters, mapActions } from 'vuex';

export default {
  computed: {
    ...mapGetters('counter', ['getCount']),
  },
  methods: {
    ...mapActions('counter', ['incrementCount']),
  },
};
</script>