store的使用

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
import num from './num.js'
import str from './str.js'
 
export default new Vuex.Store({
	state:{
		src:'yuanshi',
		show:false
	},
    modules:{
        num_store:num,
        str_store:str
    },
    mutations:{//使用 $store.commit('qian') 来触发 mutations 中的qian 方法
    	qian(state){//这里面的state对应着上面这个state
    		state.src = '大王',		
    		state.show = state.show?false:true,
    		state.num_store.age = 19		
    	},
    	qiana(state){
    		state.str_store.name = '小王'		
    	},
    	addNum(state){
    		state.num_store.num ++		
    	}
   },
   actions:{
     	qian(context){//这里的context和我们使用的$store拥有相同的对象和方法
     		context.commit('qian');
     		context.commit('qiana');
     		context.commit('addNum');
     	}
   },
   getters:{//如果要使用下面的not_show.需要在模板中使用$store.getters.not_show
   	  not_show(state){//这里的state就是对应的是上面的state
   	  	return !state.show
   	  }
   }
})

// 导入获取订单api
import { getorders } from "@/api/order"
export default ({
  state: {
    // 定义订单
    orders:[]
  },
  getters: {
  },
  mutations: {
      //使用 $store.commit('qian') 来触发 mutations 中的qian 方法
      SET_ORDERS(state:any,data:any){
        //这里面的state对应着上面这个state
        //更新order模块的state的orders数据
          state.orders=data;
      }
  },
  actions: {
    // mutations异步方法，获取值，在调用用actions里方法给数据赋值的
      //定义异步方法获取订单
      getWebOrder(context:any){
          getorders()
          .then(res=>{
              //这里的context和我们使用的$store拥有相同的对象和方法
              //获取完毕订单 执行mutation设置订单方法
              context.commit("SET_ORDERS",res.data.data)
          })
      }
  },
  modules: {
  //使用订单模块
    order
  }
})