应用场景：在page1页面查询某个数据，page2页可修改page1中的数据项。为了避免page1中的不必要刷新，现采用vuex来在page2中控制page1是否需要刷新。
vuex的声明文件
import queryInfoApi from 'xxxApi.js'
const store={
state:{ list:[], },
mutations:{
setInfo(state,payload){ state.list=payload }
},
action:{
getInfo:async({commit,state},{...params})=>{
const {data}=await queryInfoApi({...params})
const results=data.result.results||[]
commit('setInfo',results)
} }
}
export default store
在store的index.js文件中声明模块 并在main.js文件中引用
import Vue from "vue";
import Vuex from "vuex";
import info from 'store文件路径'
Vue.use(Vuex)
const store=new Vuex.Store({ modules:{ info }})
export default store;
在page1中
import { mapState, mapActions } from 'vuex';
在computed中声明数据对象
computed:{ ...mapState({ datalist:(state)=>state.info.list })}
在methods中，声明方法...mapActions(['getInfo',])
在methods中定义方法
async getInfoList(){ await this.$store.dispatch('getInfo',{page:1,pageSize:10})}
(page:1,pageSize:10为查询接口所需参数)
数据初始化或在其他需要刷新的时候，调用this.getInfoList()
在page2中
当你在修改某一项之后，想要触发page1的数据修改在想触发的时候，
this.$store.dispatch('getInfo',{page:1,pageSize:10})
(page:1,pageSize:10为查询接口所需参数)
