vuex的应用

在我们用vue编程的时候，经常会用到vuex这个插件，而在具体的开发过程中vuex是如何应用的呢？

首先vuex的定义是什么：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。简单来说就是处理所有组件数据共享的。
其次，我们如何使用：我们在使用vuex，因为只能建立一个store，所以如果在开发过程中不能把所有的程序都放到store中的index.js中，所以我们就用到了模块化的开发。一下就是我们常用的一些步骤

1.在store文件中建立一个新的模块，例city.js里面写上代码

const city = {
    // 命名空间
    namespaced: true,
    // 设置默认值
    state:{
        cityName:"上海"
    },
    mutations:{
        setCityName(state,name){
            state.cityName = name
        }
    }
}



export default city

2.然后我们就需要在store文件中的入口文件index.js中引入，注册

import city from "./module/city"   //引入


let store = new Vuex.Store({

    modules:{
        city      //注册
    }

3.此时我们就可以使用在组件city.vue中了，

methods:{
      ...mapMutations("city",["setCityName"]),   //对象里面不能再嵌套对象，所以需要先展开
      clickCity(item){   //这里为点击要执行的函数，包含里面要传的数据
          this.setCityName(item.name)    //这里是要执行方法
      },

vuex有五个核心 在使用各自对应辅助方法时应用的地方也不相同

State：应用在computed

Getter：应用在computed

Mutation：应用在methods

Action：应用在methods

module
暂且先说这么多，后期再补。