vuex的安装
1、通过script标签引入,必须要再引入vue文件之后
<script src="/path/to/vue.js"></script>
<script src="/path/to/vuex.js"></script>
2、npm安装
npm install vuex --save
npm安装以后可以在项目中新建一个store文件夹
在该文件夹下创建一个index.js,然后导如Vuex
import Vue from 'Vue'
import Vuex from 'Vuex'
//使用Vuex
Vue.use(Vuex)
创建要给Vuex对象
const store = new Vuex.Store({
state: {//存放的数据,相当于组件的data
count: 0
},
mutations: {//方法,相当于组件的methods
increment (state) {
state.count++
}
},
getters:{//相当于组件中的computed计算属性,返回值会被缓存,依赖的值改变时才会改变
getCount(){
return state.count+1;
}
},
actions:{
//Action 提交的是 mutation,而不是直接变更状态。
//Action 可以包含任意异步操作。
increment(context){
//此处的context对象是和store实例具有相同的属性和对象
context.commit('increment')
}
}
})