新建store.js
import Vue from "vue"
import Vuex from "vuex"
Vue.use(Vuex);
var state = {
count: 1
}
var mutations = {
add(state, arg) {
state.count++;
}
}
var actions = {
add({ commit }) {
commit("add");
}
}
var getters = {
countplus(state) {
return state.count + "的包装属性";
}
}
var store = new Vuex.Store({
state, actions, mutations, getters
})
export default store
app.vue使用
<input
type="text"
v-model="$store.state.count"
/>
<input
type="text"
v-model="$store.getters.countplus"
/>
<input
type="button"
value="add"
@click='$store.dispatch("add")'
>
$store.dispatch("add")
会调用actions的add方法
commit("add")
会调用mutations的add方法
getters
是可在不改变state的情况下对其增强,类似代理
网友评论