如何在 Store Vuex 中加载 DOM 之前调用 api？

Posted 2023-02-16

【中文标题】如何在 Store Vuex 中加载 DOM 之前调用 api？

【英文标题】：How to call an api before loading the DOM in Store Vuex?

【发布时间】：2021-12-08 13:18:30

【问题描述】：

我想在加载 DOM 之前执行一个函数以从 API 获取数据，我知道在 vue 中它是在 Create 之前，但是我如何在 VUEX 存储中执行它？

【问题讨论】：

不能直接调用store里面的函数吗？

它不起作用

【参考方案1】：

在 VueX 中，您在“actions”中执行异步代码。因此，您创建一个操作并从 beforeCreate 生命周期挂钩或您想放置的任何位置调用它。

要调用一个动作，你可以使用this.$store.dispatch('getMatches') 或者你可以将一个动作映射到你的组件方法块：

methods: 
  ...mapActions([
    'getMatches'
  ])
,
beforeCreate() 
  this.getMatches();

通常操作也以小写字母开头，因为它们是方法。

【讨论】：

这样做会给我一个错误，我不知道我是否做错了我这样做：import mapActions from 'vuex'beforeCreate () ... mapActions (['GetMatches'])

您希望将操作映射到 Vue 组件的 methods 对象。我已经更新了我的答案。