详解VUEX
2018-12-11 本文已影响9人
嘤夏影
安装vuex
npm install vuex -s
安装完之后新建一个store.js文件
import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
Vue.use(Vuex)
// 整站公共变量和方法,如果是变量的话是不能在每个页面中使用的,刷新后就没了,常量就没有影响
export default new Vuex.Store({
state: {
constant:'这是一个公共的常量,在任何页面都可以使用',
variable:''//这是变量
},
getters: {//用于暴露state的数据,在页面中可以使用this.$store.getters.showConstant来显示state中的constant
showConstant(state){
return state.constant
}
}
mutations: {//修改state的值只能在mutations里面修改
getConstant(state, data) {
state.constant = data;
},
getVariable(state, data) {
state.variable = data;
}
},
actions: {//异步请求都是在actions里面
toVariable(store, code) {
axios
.get('/hr/authorize', {
params: {
authcode: code,
state: false
}
}).then(function (res) {
store.commit('getVariable', res.empcode)//将请求到的数据存放在state里面以便在各页面使用
})
}
}
})