如何使用 rest API 在应用程序启动时正确初始化 Vuex 商店？

【问题标题】：How to properly initialize Vuex store on app startup using rest API?如何使用 rest API 在应用程序启动时正确初始化 Vuex 商店？
【发布时间】：2019-12-06 12:51:19
【问题描述】：

我想使用从 API 获取的一些数据来初始化商店（我正在使用 axios）如何在应用启动时执行此操作，仅一次？

我有一个用于导出我的商店的 store.js 文件和一个执行此操作的 main.js 文件：

import Vue from "nativescript-vue";
import store from "./store";

new Vue({
  store,
  render: (h) => h("frame", [h(App)]),
}).$start();

【问题讨论】：

标签： vue.js axios nativescript vuex nativescript-vue

【解决方案1】：

尝试将.dispatch() 与您的Axios REST API 抓取功能一起使用在Vue 主组件（包含存储的那个）的created() 挂钩中：

new Vue({
  store,
  render: (h) => h("frame", [h(App)]),
  created() {
    this.$store.dispatch('myAxiosFetchFunction');
  },
}).$start();

【讨论】：

在哪个组件上创建了钩子？我希望整个应用程序只运行一次。
在主组件中，在你放new Vuex.Store(store)的组件中。
好吧，我不知道你的应用程序的组件布局，但主/父组件听起来是正确的选择，因为你可能只有一个副本...
@Ali 不是一个组件。那是 store.js 文件......哦，你的意思是 Vue 实例中的 main.js 文件
@Zaroth 你能根据我的编辑更新你的答案吗？