将Axios调用的结果添加到状态

npm install axios vuex

import Vue from 'vue';
import Vuex from 'vuex';
import axios from 'axios';

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    data: null, // 初始化状态为null
  },
  mutations: {
    setData(state, payload) {
      state.data = payload; // 将Axios调用的结果保存到状态中
    },
  },
  actions: {
    fetchData({ commit }) {
      axios.get('/api/data') // 发起Axios请求
        .then(response => {
          commit('setData', response.data); // 调用mutation将结果保存到状态中
        })
        .catch(error => {
          console.error(error);
        });
    },
  },
});

new Vue({
  store,
  // ...其他配置
}).$mount('#app');

import { mapState } from 'vuex';

export default {
  // ...其他配置
  computed: {
    ...mapState(['data']), // 映射状态中的data到组件的data属性
  },
};