vuejs随笔小结
1./core/util/perf.js
import { inBrowser } from './env' //运行环境在浏览器为true export let mark //window.performance.mark export let measure //重写了window.performance.measure函数
2./core/utils/options.js
// 对option[key]进行策略处理,默认不处理 function mergeField (key) { const strat = strats[key] || defaultStrat options[key] = strat(parent[key], child[key], vm, key) }
3.插件的写法Vue.use
这段源码简单,global-api/use.js中,this._installedPlugins储存插件的数组。
export function initUse (Vue: GlobalAPI) { Vue.use = function (plugin: Function | Object) { const installedPlugins = (this._installedPlugins || (this._installedPlugins = [])) // 已经执行过了插件暴露的方法就不需要执行了 if (installedPlugins.indexOf(plugin) > -1) { return this } // additional parameters, args忽略第一个参数。 const args = toArray(arguments, 1) args.unshift(this) // 第一个参数是vue本身了 if (typeof plugin.install === 'function') { // 插件要实现install函数,或者本身就是函数, plugin.install.apply(plugin, args) } else if (typeof plugin === 'function') { plugin.apply(null, args) } installedPlugins.push(plugin) return this }
4. 事件修饰符~,!
5.vue的代码写法
先是给Vue这个函数(对象)原型赋值,然后是静态方法定义,如下:
//Vue类 function Vue (options) { if (process.env.NODE_ENV !== 'production' && !(this instanceof Vue) ) { warn('Vue is a constructor and should be called with the `new` keyword') } this._init(options) } initMixin(Vue) //Vue.prototype._init赋值。初始化Vue对象时,会调用_init函数 stateMixin(Vue) //原型赋值 $set、$delete、$watch、$data、$props eventsMixin(Vue) //原型赋值 on once off emit lifecycleMixin(Vue) //forceUpdate,destroy ,_update renderMixin(Vue) //$nextTick和_render,和对Vue.protoype对象赋值大量的私有变量,如:
target._o = markOnce
target._n = toNumber
target._s = toString
target._l = renderList
target._t = renderSlot
target._q = looseEqual
target._i = looseIndexOf
target._m = renderStatic
target._f = resolveFilter
target._k = checkKeyCodes
target._b = bindObjectProps
target._v = createTextVNode
target._e = createEmptyVNode
target._u = resolveScopedSlots
target._g = bindObjectListeners
target._d = bindDynamicKeys
target._p = prependModifier