vuex中的辅助函数

Vuex 中的辅助函数是指一些用于简化在 Vue 组件中使用 Vuex 的函数。以下是一些常用的辅助函数：

1. mapState：用于将 store 中的状态映射到组件的计算属性中。可以通过对象字面量或数组来指定要映射的状态。

import { mapState } from 'vuex';

export default {
  computed: {
    ...mapState(['count']),
    // 或者使用对象字面量
    ...mapState({
      message: (state) => state.someModule.message
    })
  }
}

2. mapGetters：用于将 store 中的 getters 映射到组件的计算属性中。与 `mapState` 类似，可以通过对象字面量或数组来指定要映射的 getters。

import { mapGetters } from 'vuex';

export default {
  computed: {
    ...mapGetters(['doneTodosCount']),
    // 或者使用对象字面量
    ...mapGetters({
      doneTodosCount: 'doneTodosCount'
    })
  }
}

3. mapMutations：用于将 store 中的 mutations 映射到组件的方法中。同样可以通过对象字面量或数组来指定要映射的 mutations。

import { mapMutations } from 'vuex';

export default {
  methods: {
    ...mapMutations(['increment']),
    // 或者使用对象字面量
    ...mapMutations({
      add: 'increment'
    })
  }
}

4. mapActions：用于将 store 中的 actions 映射到组件的方法中。与 `mapMutations` 类似，可以通过对象字面量或数组来指定要映射的 actions。

import { mapActions } from 'vuex';

export default {
  methods: {
    ...mapActions(['incrementAsync']),
    // 或者使用对象字面量
    ...mapActions({
      addAsync: 'incrementAsync'
    })
  }
}

这些辅助函数可以帮助我们在组件中更方便地使用 Vuex 的状态、getters、mutations 和 actions。