[weex] enable extended constructors to use mixins

Author: yyx990803

flow/options.js

@@ -60,6 +60,7 @@ declare type ComponentOptions = {
   _renderChildren?: ?VNodeChildren;
   _componentTag: ?string;
   _scopeId: ?string;
+  _base: Class<Component>;
 }
 
 declare type PropOptions = {

src/core/global-api/assets.js

@@ -26,7 +26,7 @@ export function initAssetRegisters (Vue: GlobalAPI) {
         }
         if (type === 'component' && isPlainObject(definition)) {
           definition.name = definition.name || id
-          definition = Vue.extend(definition)
+          definition = this.options._base.extend(definition)
         }
         if (type === 'directive' && typeof definition === 'function') {
           definition = { bind: definition, update: definition }

src/core/global-api/extend.js

@@ -18,9 +18,10 @@ export function initExtend (Vue: GlobalAPI) {
   Vue.extend = function (extendOptions: Object): Function {
     extendOptions = extendOptions || {}
     const Super = this
-    const isFirstExtend = Super.cid === 0
-    if (isFirstExtend && extendOptions._Ctor) {
-      return extendOptions._Ctor
+    const SuperId = Super.cid
+    const cachedCtors = extendOptions._Ctor || (extendOptions._Ctor = {})
+    if (cachedCtors[SuperId]) {
+      return cachedCtors[SuperId]
     }
     const name = extendOptions.name || Super.options.name
     if (process.env.NODE_ENV !== 'production') {
@@ -42,8 +43,10 @@ export function initExtend (Vue: GlobalAPI) {
       extendOptions
     )
     Sub['super'] = Super
-    // allow further extension
+    // allow further extension/mixin/plugin usage
     Sub.extend = Super.extend
+    Sub.mixin = Super.mixin
+    Sub.use = Super.use
     // create asset registers, so extended classes
     // can have their private assets too.
     config._assetTypes.forEach(function (type) {
@@ -59,9 +62,7 @@ export function initExtend (Vue: GlobalAPI) {
     Sub.superOptions = Super.options
     Sub.extendOptions = extendOptions
     // cache constructor
-    if (isFirstExtend) {
-      extendOptions._Ctor = Sub
-    }
+    cachedCtors[SuperId] = Sub
     return Sub
   }
 }

src/core/global-api/index.js

@@ -31,6 +31,10 @@ export function initGlobalAPI (Vue: GlobalAPI) {
     Vue.options[type + 's'] = Object.create(null)
   })
 
+  // this is used to identify the "base" constructor to extend all plain-object
+  // components with in Weex's multi-instance scenarios.
+  Vue.options._base = Vue
+
   util.extend(Vue.options.components, builtInComponents)
 
   initUse(Vue)

src/core/global-api/mixin.js

@@ -4,6 +4,6 @@ import { mergeOptions } from '../util/index'
 
 export function initMixin (Vue: GlobalAPI) {
   Vue.mixin = function (mixin: Object) {
-    Vue.options = mergeOptions(Vue.options, mixin)
+    this.options = mergeOptions(this.options, mixin)
   }
 }

src/core/vdom/create-component.js

@@ -1,6 +1,5 @@
 /* @flow */
 
-import Vue from '../instance/index'
 import VNode from './vnode'
 import { normalizeChildren } from './helpers/index'
 import { resolveConstructorOptions } from '../instance/init'
@@ -23,8 +22,9 @@ export function createComponent (
     return
   }
 
+  const baseCtor = context.$options._base
   if (isObject(Ctor)) {
-    Ctor = Vue.extend(Ctor)
+    Ctor = baseCtor.extend(Ctor)
   }
 
   if (typeof Ctor !== 'function') {
@@ -39,7 +39,7 @@ export function createComponent (
     if (Ctor.resolved) {
       Ctor = Ctor.resolved
     } else {
-      Ctor = resolveAsyncComponent(Ctor, () => {
+      Ctor = resolveAsyncComponent(Ctor, baseCtor, () => {
         // it's ok to queue this on every render because
         // $forceUpdate is buffered by the scheduler.
         context.$forceUpdate()
@@ -195,6 +195,7 @@ function destroy (vnode: MountedComponentVNode) {
 
 function resolveAsyncComponent (
   factory: Function,
+  baseCtor: Class<Component>,
   cb: Function
 ): Class<Component> | void {
   if (factory.requested) {
@@ -207,7 +208,7 @@ function resolveAsyncComponent (
 
     const resolve = (res: Object | Class<Component>) => {
       if (isObject(res)) {
-        res = Vue.extend(res)
+        res = baseCtor.extend(res)
       }
       // cache resolved
       factory.resolved = res

src/core/vdom/create-element.js

@@ -21,7 +21,7 @@ export function createElement (
   return _createElement(this._self, tag, data, children)
 }
 
-function _createElement (
+export function _createElement (
   context: Component,
   tag?: string | Class<Component> | Function | Object,
   data?: VNodeData,

src/entries/weex-framework.js

@@ -2,6 +2,7 @@ import Vue from 'weex/runtime/index'
 import renderer from 'weex/runtime/config'
 
 Vue.weexVersion = '2.0.5-weex.1'
+export { Vue }
 
 const {
   instances,
@@ -85,8 +86,11 @@ export function createInstance (
 
   // Each instance has a independent `Vue` object and it should have
   // all top-level public APIs.
-  const subVue = Vue.extend({});
-  ['util', 'set', 'delete', 'nextTick', 'use'].forEach(name => {
+  const subVue = Vue.extend({})
+  // ensure plain-object components are extended from the subVue
+  subVue.options._base = subVue
+  // expose global utility
+  ;['util', 'set', 'delete', 'nextTick'].forEach(name => {
     subVue[name] = Vue[name]
   })