renderSlots

Author: lishiwen

example/slots-simple/Slot.js

@@ -1,9 +1,9 @@
-import { h } from "../../lib/m-vue.esm.js";
+import { h, renderSlots } from "../../lib/m-vue.esm.js";
 
 export default {
   render() {
     const originalContent = h("div", {}, "这是原来的内容");
-    return h("div", {}, [originalContent, this.$slots]);
+    return h("div", {}, [originalContent, renderSlots(this.$slots)]);
   },
   setup() {},
 };

lib/m-vue.cjs.js

@@ -191,7 +191,7 @@ const ComponentPublicInstanceHandlers = {
 };
 
 function initSlots(instance, instanceChildren) {
-    instance.slots = instanceChildren || [];
+    instance.slots = isArray(instanceChildren) ? instanceChildren : [instanceChildren];
 }
 
 function promiseEmit() { }
@@ -329,10 +329,15 @@ function h(type, props, children) {
     return createVNode(type, props, children);
 }
 
+function renderSlots(slots) {
+    return createVNode('span', null, slots);
+}
+
 exports.createApp = createApp;
 exports.createComponentInstance = createComponentInstance;
 exports.createVNode = createVNode;
 exports.h = h;
 exports.patch = patch;
 exports.render = render;
+exports.renderSlots = renderSlots;
 exports.setupComponent = setupComponent;

lib/m-vue.esm.js

@@ -187,7 +187,7 @@ const ComponentPublicInstanceHandlers = {
 };
 
 function initSlots(instance, instanceChildren) {
-    instance.slots = instanceChildren || [];
+    instance.slots = isArray(instanceChildren) ? instanceChildren : [instanceChildren];
 }
 
 function promiseEmit() { }
@@ -325,4 +325,8 @@ function h(type, props, children) {
     return createVNode(type, props, children);
 }
 
-export { createApp, createComponentInstance, createVNode, h, patch, render, setupComponent };
+function renderSlots(slots) {
+    return createVNode('span', null, slots);
+}
+
+export { createApp, createComponentInstance, createVNode, h, patch, render, renderSlots, setupComponent };

src/runtime-core/componentSlots.ts

@@ -1,3 +1,5 @@
+import { isArray } from "../shared/type";
+
 export function initSlots(instance, instanceChildren) {
-    instance.slots = instanceChildren || [];
-}
+    instance.slots = isArray(instanceChildren) ? instanceChildren : [instanceChildren];
+};

src/runtime-core/helper/renderSlots.ts

@@ -0,0 +1,5 @@
+import { createVNode } from "../createVNode";
+
+export function renderSlots(slots) {
+    return createVNode('span', null, slots);
+}

src/runtime-core/index.ts

@@ -2,4 +2,5 @@ export * from "./createApp";
 export * from "./createVNode";
 export * from "./component";
 export * from "./render";
-export * from "./h"
+export * from "./h"
+export * from "./helper/renderSlots";