映射的 Vuex 函数“不是函数”，但仍然加载答案

【问题标题】：Mapped Vuex function "is not a function", but still loads映射的 Vuex 函数“不是函数”，但仍然加载
【发布时间】：2019-06-04 16:26:10
【问题描述】：

当我在挂载的钩子中调用映射的 Vuex 操作时，该操作有效，但我在控制台中收到“TypeError: xxx is not a function”错误。

这是该组件的整个脚本部分：

<script>
import SideNav from '@/components/SideNav.vue'
import ActionBar from '@/components/ActionBar.vue'
import Summaries from '@/components/Summaries.vue'
import { mapState, mapActions } from 'vuex'

export default {
  components: { SideNav, ActionBar, Summaries },
  computed: {
    ...mapState(['dataLoading']),
    ...mapActions(['init'])
  }, 
  mounted() {
    this.init();
  }
}
</script>

【问题讨论】：

我相信这个问题是因为 vue 的生命周期在计算属性之前调用了 mounted() 函数。将...mapActions(['init']) 放在你的方法中，看看会发生什么。

标签： vue.js vue-component vuex

【解决方案1】：

您应该将操作映射为methods 而不是computed，请参阅dispatch actions in components：

computed: {
  ...mapState(['dataLoading'])
},
methods: {
  ...mapActions(['init'])
},
mounted() {
  this.init();
}

【讨论】：