1.在项目根目录下创建store文件夹,在文件夹下创建index.js
2.在store/index.js文件夹引入vuex,并且定义相关属性和方法
import Vuex from 'vuex'
import Vue from 'vue'
Vue.use(Vuex)
export default new Vuex.Store({
// 全局属性变量
state: {
num: 1,
name: '苹果',
price: 10,
testList: []
},
// 全局同步方法
mutations: {
add(state) {
state.num++
console.log(state.num);
}
},
// vuex属性计算,在视图里面当做变量使用
getters: {
// 这个函数的执行依赖一个可变的变量
count(state) { // num变化这个方法就会执行
return state.num * state.price
}
},
// 异步方法,调用方法:this.$store.dispath('xxx')
actions: {
testActions(context) {
// context里面包含state、mutations、getters、actions
console.log(context);
// 执行一些异步操作,通用ajax
setTimeout(() => {
context.state.testList = ['猪猪侠', '超人强', '