Vuex的mapActions 和 mapGetters

1、介绍

mapActions 和 mapGetters 是 Vuex 提供的辅助函数，用于在组件中映射 Vuex 的 actions 和 getters。

1. mapActions 辅助函数用于将 Vuex 中的 actions 映射到组件的 methods 中，方便在组件中调用和触发 Vuex 中定义的 actions。它接受一个数组或对象作为参数，其中数组中的每个元素可以是一个字符串或对象，用于指定要映射的 actions 的名称。通过 this.$store.dispatch 方法来触发映射的 actions。
   例如：

import { mapActions } from "vuex";

export default {
  // ...
  methods: {
    ...mapActions(["action1", "action2"]),
    // 现在可以直接通过 this.action1() 和 this.action2() 调用对应的 actions
  }
}

2. mapGetters 辅助函数用于将 Vuex 中的 getters 映射到组件的 computed 属性中，方便在组件中访问 Vuex 中定义的 getters。它接受一个数组或对象作为参数，其中数组中的每个元素可以是一个字符串或对象，用于指定要映射的 getters 的名称。通过 this.$store.getters 对象来访问映射的 getters。
   例如：

import { mapGetters } from "vuex";

export default {
  // ...
  computed: {
    ...mapGetters(["getter1", "getter2"]),
    // 现在可以通过 this.getter1 和 this.getter2 访问对应的 getters
  }
}

使用 mapActions 和 mapGetters 可以简化在组件中使用 Vuex 的 actions 和 getters 的过程，提高代码的可读性和开发效率。