VUE-VUEX

Vuex是一个专为Vue.js应用程序开发的状态管理模式

1.Vuex解决了组件之间同一状态的共享问题（解决了不同组件之间的数据共享）

2.组件里面数据的持久化

小项目不建议用vuex

vuex的使用：

1.src新建一个vuex的文件夹

2.vuex文件夹里面新建一个store.js

3. 安装vuex

4.在刚才创建的store.js引入vue 引入vuex 并且use vuex

import Vuex from 'vuex'

import Vue from 'vue'

Vue.use(Vuex)

5.定义数据与方法

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

Vue.use(Vuex)

/*
1.state在vuex中用于存储数据
 */
var state={
  count:1
}
/*
2.mutations里面放的是方法，主要用于改变state里面的数据
 */
var mutations={
  incCount(){
    ++state.count;
  }
}
/*
3.有点类似计算属性，改变state里面的count数据时会触发getters
里面的方法 获取新的值(基本用不到)
 */
var getters={
  computedCount:(state)=>{
    return state.count*2
  }
}
/*
4.Action 类似于 mutation，不同在于：
  Action 提交的是 mutation，而不是直接变更状态。
  Action 可以包含任意异步操作(基本用不到)
 */
var actions= {
  incMutationsCount (context) {
    //context.commit可以执行mutations里的incCount方法，改变state里的count方法
    context.commit('incCount')
  }
}

//vuex 实例化Vuex.store
const store = new Vuex.Store({
  state,
  mutations,
  getters,
  actions
})

export default store

注册到全局：

 获取：