vuex中store的用法

假如我想创建一个文件，order.js用来管理缓存，放在store文件夹下面
1）注册moudle
在store/index.js里面

//index.js
import Vue from 'vue';
import Vuex from 'vuex';
import OrderSystem from './order'; //商城订单 add 引入
Vue.use(Vuex);

export default new Vuex.Store({
  modules: {
    order: OrderSystem//商城订单 add 引入
  }
});

2）order.js编写方法

import Vue from 'vue';
import ApiConf from '@/config/api.conf';

const State = {
    mallOrderExportExcel: {}, //注册变量
}

const MutAtions = {
    mallOrderExportExcel(state, data) {
        state.mallOrderExportExcel = data;
    }
}


const Actions = {

    mallOrderExportExcel({ commit }, params) {
        return new Promise((resolve, reject) => {
          const exl = { responseType: 'blob', headers: { download: '1' } };
          Vue.$api.post({ getway: ApiConf.order.$getway, api: ApiConf.order.mallOrderExportExcel }, params, exl).then(response => {
            //getway为网关地址，api为url子路径
            commit('mallOrderExportExcel', response.data);//刷新缓存，调用了MutAtions的mallOrderExportExcel方法
            resolve(response.data);
          }).catch(reason => {
            reject(reason);
          });
        });
      }
 }
 
 const Getters = {
    mallOrderExportExcel: state => state.mallOrderExportExcel
 }；
 
 export default {
  namespaced: true,
  strict: true,
  state: State,
  getters: Getters,
  mutations: MutAtions,
  actions: Actions
};

3）组件中应用

computed: {
    ...mapGetters({
      mallOrderExportExcel2: 'order/mallOrderExportExcel'   //这里不是字符串的意思，是将order.js的mallOrderExportExcel赋值给mallOrderExportExcel2，这里是取缓存的值
    })
  },
  
  
   //function 
    exportexc() { 

      if (this.$refs.search.handleDatePickerChange()) {


          this.exportLoading = true;
          const formSearch = this.$refs.search.formSearch;
          const params = {
            contain_mix_pay_model: Number(formSearch.contain_mix_pay_model),
            start_date: date(formSearch.start_date),
            end_date: date(formSearch.end_date),
            is_down_load: 1
          };
          console.warn({ ...formSearch, ...params }, '参数');

          let rdata0=this.mallOrderExportExcel;//数据缓存已更新


          var url='order/mallOrderExportExcel';
          var params={name:'jiangyingying',relation:'lover'};
          this.$store.dispatch(url,  params   ).then(res => { //调用store/order.js下面的Actions：mallOrderExportExcel方法
              
              if (res.code === '40004') {
                this.$message.error(res.sub_msg);
              }
            });

          let rdata=this.mallOrderExportExcel;//调用之后，数据缓存已更新
          let _this = this;
          const file = new BlobFile({
            data: rdata,
            filename: '订单列表',
            mime: MIME['xls'],
            endings: 'native'
          });
          file.download();
          file.destory();
          this.$message.success('导出成功');
          this.exportLoading = false;

      }

      
    }