vuex 状态管理
- 1.安装vuex :
- npm i vuex
- 1.在store.js里引入vuex ,注册vuex:
Vue.use(Vuex); -
- 3.定义数据
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
// 1. 存数据
var state = {
count: 1
}
// 2.方法 改变state里面的数据
var mutations = {
inCount() { //加
++state.count
},
inCount_() { //减
--state.count
}
}
const store = new Vuex.Store({
state,
mutations
})
export default store;
- 3.获取state里面的数据
- ``` {{this.$store.state.count}} ```
- 4.获取方法
- ``` incCount(){ this.$store.commit('inCount') } ```
------------
store.js
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
// 1. 存数据
var state = {
count: 1
}
// 2.方法 改变state里面的数据
var mutations = {
inCountAdd() { //加
++state.count
},
inCount_() { //减
--state.count
}
}
//实例化vuex.store
const store = new Vuex.Store({
state,
mutations
})
export default store;
---------------------------------
home.vue
home
{{this.$store.state.count}}
-----------------------------------
new.vue
{{this.$store.state.count}}