vuex 应用

93 阅读1分钟

1. 获取vuex 中 state 的值 想要直接用this.DICTXX获取则可以在mixins 中获取,全局使用

store.dispatch('getAdministrativeDivisionMaps') 触发actions

actions.js

const common = {  getAdministrativeDivisionMaps: function (context, params) {    return new Promise((resolve) => {      context.commit('SET_ADMINISTRATIVE_DIVISION', res.data || [])    })  }}export default {   ...common }

mutaions.js

const administrativeDivision = {  SET_ADMINISTRATIVE_DIVISION: (state, data) => {    state.administrativeDivisionMaps = data  }}
const mutations = {  ...administrativeDivision,}export default mutations

state.js

const administrativeDivision = {  administrativeDivisionMaps: []}const state = {  ...administrativeDivision,}export default state

index.js

import Vue from 'vue'import Vuex from 'vuex'import state from './state'import mutations from './mutations'import getters from './getters'import actions from './actions'Vue.use(Vuex)export default new Vuex.Store({  state,  mutations,  getters,  actions,  modules: {    test: moduleTest  }})

在mixins / index.js  中接收 vuex 中state 的值,全局可通过this.DICTXX/this.picBaseUrl获取相应的值

import { mapGetters, mapState } from 'vuex'export default {  data () {    return {    }  },  computed: {    ...mapGetters([      'DICTXX',      'getUserInfoXXX',    ]),    ...mapState([      'picBaseUrl', 'fileBaseUrl'    ]),  },  watch: {  },  methods: {    IEVersion () {      var userAgent = navigator.userAgent // 取得浏览器的userAgent字符串      var isIE = userAgent.indexOf('compatible') > -1 && userAgent.indexOf('MSIE') > -1 // 判断是否IE<11浏览器      var isEdge = userAgent.indexOf('Edge') > -1 && !isIE // 判断是否IE的Edge浏览器      var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf('rv:11.0') > -1      if (isIE) {        var reIE = new RegExp('MSIE (\\d+\\.\\d+);')        reIE.test(userAgent)        var fIEVersion = parseFloat(RegExp['$1'])        if (fIEVersion === 7) {          return 7        } else if (fIEVersion === 8) {          return 8        } else if (fIEVersion === 9) {          return 9        } else if (fIEVersion === 10) {          return 10        } else {          return 6// IE版本<7        }      } else if (isEdge) {        return 'edge'// edge      } else if (isIE11) {        return 11 // IE11      } else {        return -1// 不是ie浏览器      }    },    // 检查浏览器    checkIEOlderVersion () {      switch (this.IEVersion()) {        case 6:        case 7:        case 8:        case 9:        case 10:          this.$confirm('本系统暂时不支持低版本浏览器,请更换高版本浏览器(IE用户 请更换IE11及以上版本)。', '系统提示', {            showClose: false,            showCancelButton: false,            showConfirmButton: false,            closeOnClickModal: false,            type: 'warning'          })          return false        default:          return true      }    }  }}