/*** Store.js 中 applyMixin(Vue) 对应的方法。 * applyMixin(Vue) =======>*/
export default function (Vue) {
//获取版本const version = Number(Vue.version.split('.')[0])//如果版本是 2.xx 以上,就走 Vue.mixin(xxx) 方法。if (version >= 2) {
Vue.mixin({
beforeCreate: vuexInit })} else {
//1.xx 版本时候的处理,可以不看了。const _init = Vue.prototype._initVue.prototype._init = function (options = {
}) {
options.init = options.init? [vuexInit].concat(options.init): vuexInit_init.call(this, options)}}/*** Vue.mixin({ beforeCreate: vuexInit }) =====> */function vuexInit () {
/** 需要注意的是: 1、此时是在 vue 实例的内部,this指向的是刚创建出来的 vue 实力。所以 this.$options 是指 vue 实例的 options 参数。2、此时的 vue 的生命周期为 beforeCreate, 也就是说在 created(){} 生命周期的时间内,就可以使用 this.$store 属性了 。*/const options = this.$options//功能: 将 Vuex.Store() 实例在 vue 实例上进行挂在。//1、先判断当前 vue 实例的 options参数上是否有 store 属性;// 如果当前 vue 实例的 options参数上的 store 属性是个函数,就调用;否则,就直接赋值给 this.$store.if (options.store) {
//this.$store = typeof options.store === 'function'? options.store(): options.store//2、如果当前 vue 实例的 options参数上没有 store 属性;// 则去查询父组建是否含有 $store 属性,如果有,则获取父组建的 $store。} else if (options.parent && options.parent.$store) {
//这里为什么不需要逐级往上找了?因为组建创建的过程是一个自顶向下的过程,会将 $store 属性逐步完成从父组建传递到子组件的过程。 this.$store = options.parent.$store}}
}
详细解决方案
vuex3.0源码注释系列 /src/mixin.js
热度:20 发布时间:2023-10-26 11:48:28.0
相关解决方案
- 您的 mixin 兼容 ECMAScript 5 吗
- 怎么 mixin
- vue插槽,混入 (mixin) ,自定义指令,Vue.set全局操作
- vuex3.0源码注释系列 /src/mixin.js
- vuex3.0源码注释系列 vuex入口文件/src/index.js
- python Mixin 学习
- Vue.mixin 源码
- Ruby七天入门(3 Mixin,集合,文件操作)
- Dart —— 类 变量,函数 ,构造函数,隐式接口,mixin ,with ,静态变量和方法
- 【Python基础】Python面向对象 - 7 - Mixin MRO
- 2022-04-20 Sass学习笔记(四) Sass的混入(mixin),继承(extend)和导入(import)
- 2022-04-17 Sass学习笔记(二) Sass的语法:变量,条件分支,循环,mixin
- vue中 公用组件、mixin、公用函数(.JS)、vuex 区别
- sass文件的中的@mixin 和%
- Python Mixin 混入方式实现单例
- 混合器定义组来实现样式复用 mixin.scss
- scss-@mixin
- Vue学习笔记之混入 (mixin)
- vue的extend、extends、mixin