将项目接口数据全部存到vuex中如何

将项目接口数据全部存到Vuex中，可以按照以下步骤进行：

1. 首先，在Vuex中创建一个模块来存储接口数据。可以在store文件夹中的index.js中引入新建的模块。例如，创建一个名为apiData的模块，可以在index.js中写入以下代码：

import Vue from 'vue'
import Vuex from 'vuex'
import apiData from './modules/apiData'

Vue.use(Vuex)

export default new Vuex.Store({
  modules: {
    apiData
  }
})

2. 创建apiData模块，并在模块中定义state、mutations、actions和getters。可以在store文件夹中新建一个名为modules的文件夹，并在其中创建一个名为apiData.js的文件。

// apiData.js

const state = {
  data: []
}

const mutations = {
  SET_DATA(state, payload) {
    state.data = payload
  }
}

const actions = {
  fetchData({ commit }) {
    // 调用接口获取数据并将数据通过commit方法传给mutations
    yourApi.fetchData().then(response => {
      commit('SET_DATA', response.data)
    }).catch(error => {
      console.log(error)
    })
  }
}

const getters = {
  getData: state => state.data
}

export default {
  state,
  mutations,
  actions,
  getters
}

3. 在需要使用接口数据的组件中，可以通过mapGetters、mapActions等辅助函数从Vuex中获取数据和触发actions。例如，在一个名为DataList的组件中，可以这样使用：

<template>
  <div>
    <div v-for="item in apiData" :key="item.id">
      {{ item.name }}
    </div>
    <button @click="fetchData">获取数据</button>
  </div>
</template>

<script>
import { mapGetters, mapActions } from 'vuex'

export default {
  computed: {
    ...mapGetters(['getData'])
  },
  methods: {
    ...mapActions(['fetchData'])
  },
  created() {
    this.fetchData() // 在组件创建时调用接口获取数据
  }
}
</script>

通过以上步骤，就可以将项目的接口数据全部存储到Vuex中，并在需要的组件中获取和使用这些数据。