Vuex全局码表mixins配置

//src\store\modules\dicts.js

import { getDictParamTableBatch } from '@/api/common/index'
import store from '@/store'
import Vue from 'vue'
class Dict {
  constructor(dict) {
    this.dict = dict
  }

  async init(names) {
    const ps = []
    const hash = {}
    names.forEach((name) => {
      if (store.getters.dicts[name]) {
        Vue.set(this.dict, name, store.getters.dicts[name])
      } else {
        Vue.set(this.dict, name, [])
        hash[name] = name
      }
    })
    const dictCodeList = Object.keys(hash).map(v => hash[v])
    ps.push(
      getDictParamTableBatch({ dictCodeList }).then((res) => {
        res.data.forEach(item => {
          this.dict[item.dictCode] = Object.freeze(item.dictParamTables)
          store.commit('dicts/SET_DICTS', {
            label: item.dictCode,
            value: Object.freeze(item.dictParamTables)
          })
        })
      })
    )
    await Promise.all(ps)
  }
}

const install = function(Vue) {
  Vue.mixin({
    data() {
      if (
        this.$options.dicts instanceof Array &&
                this.$options.dicts.length > 0
      ) {
        return { dict: {}}
      } else {
        return {}
      }
    },
    created() {
      if (
        this.$options.dicts instanceof Array &&
                this.$options.dicts.length > 0
      ) {
        new Dict(this.dict).init(this.$options.dicts)
      }
    }
  })
}

export default { install }

// 全局字典
import dict from '@/mixins/dicts.js'
Vue.use(dict)

  dicts: state => state.dicts.dicts

  computed: {
    ...mapGetters(['dicts'])
  },
  dicts: ['bab005', 'bab007'],
  watch: {
    dict(v) {
      console.log(v)// 建议使用
    }
  },
  async mounted() {
    // 取值 this.dict['bab005'] 就能取到该字典
    const timer = setTimeout(() => { // 不推荐使用。网络差时会出现问题
      clearTimeout(timer)
      console.log(this.dict['bab005'])
    }, 1500)
  },
  methods: {
    // 详情
    detailClick() {
      this.isVisible = true
    },
    codeClick() {
      // 取值 this.dict['bab005'] 就能取到
      console.log(this.dict['bab005']) // 1.直接获取全局变量dict里面的
      console.log(this.dicts) // 2.取mapGetter里面的
      console.log(this.$store.getters.dicts) // 3.取store仓库getters里面的
    }
  }