improve createSlotVNodes

Author: 38elements

Diff for: packages/create-instance/create-functional-component.js

@@ -7,7 +7,6 @@ import { createSlotVNodes } from './create-slot-vnodes'
 export default function createFunctionalComponent (
   component: Component,
   mountingOptions: Options,
-  _Vue: Component
 ): Component {
   if (mountingOptions.context && typeof mountingOptions.context !== 'object') {
     throwError('mount.context must be an object')
@@ -26,7 +25,7 @@ export default function createFunctionalComponent (
           mountingOptions.context.children.map(
             x => (typeof x === 'function' ? x(h) : x)
           )) ||
-          createSlotVNodes(h, mountingOptions.slots || {}, _Vue)
+          createSlotVNodes(h, mountingOptions.slots || {}, this)
       )
     },
     name: component.name,

Diff for: packages/create-instance/create-instance.js

@@ -51,7 +51,7 @@ export default function createInstance (
     (component.options && component.options.functional) ||
     component.functional
   ) {
-    component = createFunctionalComponent(component, options, _Vue)
+    component = createFunctionalComponent(component, options)
   } else if (options.context) {
     throwError(
       `mount.context can only be used when mounting a ` + `functional component`
@@ -142,7 +142,7 @@ export default function createInstance (
     provide: options.provide,
     render (h) {
       const slots = options.slots
-        ? createSlotVNodes(h, options.slots, _Vue)
+        ? createSlotVNodes(h, options.slots, this)
         : undefined
       return h(
         Constructor,

Diff for: packages/create-instance/create-slot-vnodes.js

@@ -1,60 +1,46 @@
 // @flow
 
-import Vue from 'vue'
 import { compileToFunctions } from 'vue-template-compiler'
 
-function startsWithTag (str: SlotValue): boolean {
-  return typeof str === 'string' && str.trim()[0] === '<'
-}
-
 function createVNodesForSlot (
   h: Function,
   slotValue: SlotValue,
   name: string,
-  _Vue: any
+  vm: Component
 ): VNode | string {
-  if (typeof slotValue === 'string' && !startsWithTag(slotValue)) {
-    return slotValue
-  }
-
-  const el =
-    typeof slotValue === 'string' ? compileToFunctions(slotValue) : slotValue
-
-  let vnode = h(el)
+  let vnode
   if (typeof slotValue === 'string') {
-    const vue = new Vue()
-    const _vue = new _Vue()
-    for (const key in _vue._renderProxy) {
-      if (!(vue._renderProxy[key])) {
-        vue._renderProxy[key] = _vue._renderProxy[key]
-      }
-    }
-    try {
-      // $FlowIgnore
-      vnode = el.render.call(vue._renderProxy, h)
-      vnode = h(vnode.tag, vnode.data || {}, vnode.children)
-    } catch (e) {
-    }
+    const el = compileToFunctions(`<div>${slotValue}{{ }}</div>`)
+    const _staticRenderFns = vm._renderProxy.$options.staticRenderFns
+    vm._renderProxy.$options.staticRenderFns = el.staticRenderFns
+    vnode = el.render.call(vm._renderProxy, h)
+    vm._renderProxy.$options.staticRenderFns = _staticRenderFns
+    vnode = vnode.children[0]
+  } else {
+    vnode = h(slotValue)
+  }
+  if (vnode.data) {
+    vnode.data.slot = name
+  } else {
+    vnode.data = { slot: name }
   }
-
-  vnode.data.slot = name
   return vnode
 }
 
 export function createSlotVNodes (
   h: Function,
   slots: SlotsObject,
-  _Vue: any
+  vm: Component
 ): Array<VNode | string> {
   return Object.keys(slots).reduce((acc, key) => {
     const content = slots[key]
     if (Array.isArray(content)) {
       const nodes = content.map(
-        slotDef => createVNodesForSlot(h, slotDef, key, _Vue)
+        slotDef => createVNodesForSlot(h, slotDef, key, vm)
       )
       return acc.concat(nodes)
     }
 
-    return acc.concat(createVNodesForSlot(h, content, key, _Vue))
+    return acc.concat(createVNodesForSlot(h, content, key, vm))
   }, [])
 }