vue.js - 使用 Vuex，为什么 mapGetters 不接受与 mapState 相同的语法？

Question

我有一个 Vue 组件，它映射来自 Vuex 商店的状态、突变、动作和 getter。

import {mapState, mapMutations, mapActions, mapGetters} from 'vuex'
export default {
  name: 'DefaultLayout',
  computed: {
    ...mapState({
      settings: (state) => state.settings,
      language: (state) => state.language
    }),
    ...mapState([
      'changeRouteTo'
    ]),
    ...mapGetters([
      'isLoggedIn'
    ])
  }
...

问题是，我无法...mapGetters像使用上面的第一个实例那样使用显式语法...mapState。

我试过了

...mapGetters({
  isLoggedIn: (state) => state.getters.isLoggedIn
})

和

...mapGetters({
  isLoggedIn: (state) => state.isLoggedIn
})

和

...mapGetters({
  isLoggedIn: (state) => this.$store.getters.isLoggedIn
})

但只有

...mapGetters([
  'isLoggedIn'
])

似乎工作。

标签： vue.jsvue-componentvuex

Answer 1

在语法中使用对象...mapGetters如下：

...mapGetters({
  isLoggedIn: 'isLoggedIn'
})

其中键是您希望 getter 映射到的名称，值是作为字符串的 getter 名称