Browse Source

support <component :is="...">

Evan You 10 years ago
parent
commit
3630bf1053
3 changed files with 19 additions and 0 deletions
  1. 6 0
      src/compiler/codegen/index.js
  2. 10 0
      src/compiler/parser/index.js
  3. 3 0
      src/runtime/vdom/component.js

+ 6 - 0
src/compiler/codegen/index.js

@@ -17,6 +17,8 @@ function genElement (el) {
     return genRender(el)
   } else if (el.tag === 'slot') {
     return genSlot(el)
+  } else if (el.tag === 'component') {
+    return genComponent(el)
   } else {
     // if the element is potentially a component,
     // wrap its children as a thunk.
@@ -141,6 +143,10 @@ function genSlot (el) {
   return `($slots[${name}] || ${genChildren(el)})`
 }
 
+function genComponent (el) {
+  return `__h__(${el.component}, ${genData(el)}, ${genChildren(el, true)})`
+}
+
 function genProps (props) {
   let res = ''
   for (let i = 0; i < props.length; i++) {

+ 10 - 0
src/compiler/parser/index.js

@@ -131,6 +131,7 @@ export function parse (template, options) {
         processIf(element)
         processRender(element)
         processSlot(element)
+        processComponent(element)
         processClassBinding(element)
         processStyleBinding(element)
         processAttrs(element)
@@ -300,6 +301,15 @@ function processSlot (el) {
   }
 }
 
+function processComponent (el) {
+  if (el.tag === 'component') {
+    let staticName = getAndRemoveAttr(el, 'is')
+    el.component = staticName
+      ? JSON.stringify(staticName)
+      : (getAndRemoveAttr(el, ':is') || getAndRemoveAttr(el, 'v-bind:is'))
+  }
+}
+
 function processClassBinding (el) {
   const staticClass = getAndRemoveAttr(el, 'class')
   el.staticClass = parseText(staticClass) || JSON.stringify(staticClass)

+ 3 - 0
src/runtime/vdom/component.js

@@ -3,6 +3,9 @@ import { callHook } from '../instance/lifecycle'
 import { warn } from '../util/index'
 
 export default function Component (Ctor, data, parent, children) {
+  if (!Ctor) {
+    return
+  }
   if (typeof Ctor === 'object') {
     Ctor = Vue.extend(Ctor)
   }