let Vue;
class Store {
constructor(options) {
// state的响应式处理
this.state = new Vue({
data: options.state;
});
this._mutations = options.mutations;
this.actions = options.actions;
this.commit = this.commit.bind(this);
this.dispatch = this.dispatch.bind(this);
this.getters = {};
this.getters && this.handleGetters(options.getters)
};
handleGetters(getters) {
Object.keys(getters).map(item => {
Object.defineProperty(this.getters, item, {
get :() => getters[item](this.state)
})
})
};
commit( type, payload ) {
const Env = this._mutations[type];
if( !Env ) {
console.err(''xxxxxxxxx);
}
Env(this,state, payload);
};
dispatch( type, payload) {
const Env = this.actions[type];
if( !Env ) {
console.err(''xxxxxxxxx);
}
Env(this,state, payload);
}
}
const install = (_Vue) => {
Vue = _Vue;
Vue.mixin({
beforeCreate() {
if( this,$options.store) {
Vue.prototype.$store = this.$options.store;
}
}
})
};
export default {Store, install}
```
简单实现Vuex
最新推荐文章于 2024-07-12 19:47:55 发布