vuex 业务使用

1 创建变量

cityVuex.js

export default {
  state: {
    cityArr: []
  },
  mutations: {
    setCityArr (state, arr) {
      state.cityArr = arr
    }
  },
  actions: {}
}

2.合并变量

import Vue from 'vue'
import Vuex from 'vuex'

import user from './module/user'
import app from './module/app'
import pageInfo from './module/pageInfo'
import cityVuex from './module/cityVuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    //
  },
  mutations: {
    //
  },
  actions: {
    //
  },
  modules: {
    user,
    pageInfo,
    app,
    cityVuex
  }
})

上面两块都是创建变量部分

下面是页面引用

import { mapMutations, mapState } from 'vuex'

这里就是展开变量

computed: {
    ...mapState({
      cityArr: state => state.cityVuex.cityArr
    })
  },


赋值变量

methods: {
    ...mapMutations(['setCityArr']),

由于我迪调用的城市组件 可能改写原数组，所有，再转到data下用

data () {
    return {
      innerCityOptions: this.cityArr,