vue vuex 挂载_vuex的store是如何挂载到每个组件中

为什么我们在组件中直接this.$store.xx,就可以对vuex进行操作。

每次我们在使用vuex的时候需要

import Vue from 'vue';

import Vuex from 'vuex';

Vue.use(Vuex);

Vue.use会执行Vuex对象中的install方法

function install (_Vue) {

// 防止重复调用install

if (Vue && _Vue === Vue) {

console.error('[vuex] already installed.Vue.use(Vuex) should be called only once.');

return；

}

Vue = _Vue;

applyMixin(Vue);

}

在install方法中调用了applyMixin方法

function applyMixin (Vue) {

// 获取vue的版本

var version = Number(Vue.version.split('.')[0]);

if (version >= 2) {

Vue.mixin({ beforeCreate: vuexInit });

} else {

// 对低于vue低于2的版本处理

// override init and inject vuex init procedure

// for 1.x backwards compatibility.