From a57cd44f3750f26174ed13ca044d55e5ec877441 Mon Sep 17 00:00:00 2001
From: liuhanchen <liuhanchen@zeyihuoyun.com>
Date: Fri, 9 Jun 2023 10:49:20 +0800
Subject: [PATCH] feat: 优化虚拟节点渲染

---
 packages/schema-page/index.vue | 10 ++++++++--
 packages/table/normal.vue      |  7 ++++++-
 packages/utils/vnode.js        | 35 ++++++++++++++++++++++++++++++++++-
 3 files changed, 48 insertions(+), 4 deletions(-)

diff --git a/packages/schema-page/index.vue b/packages/schema-page/index.vue
index 0a8a80c..c94c620 100644
--- a/packages/schema-page/index.vue
+++ b/packages/schema-page/index.vue
@@ -36,9 +36,15 @@
       </slot>
     </div>
     <!-- 表格内容 -->
-    <div v-if="schema.table || $scopedSlots.table" class="z-schema-page__table" v-loading="schema.loading !== false ? tableLoading : false">
+    <div v-if="schema.table || $scopedSlots.table" class="z-schema-page__table">
       <slot name="table" v-bind="_slotScope">
-        <z-schema-table :size="_size" :schema="tableSchemaDefaultProps(schema.table)" :data="tableData" @selection-change="onTableSelectionChange">
+        <z-schema-table
+          v-loading="schema.loading !== false ? tableLoading : false"
+          :size="_size"
+          :schema="tableSchemaDefaultProps(schema.table)"
+          :data="tableData"
+          @selection-change="onTableSelectionChange"
+        >
           <template #prepend>
             <slot name="table-prepend">
               <el-table-column v-if="schema.selection !== false" type="selection" width="40" align="center"></el-table-column>
diff --git a/packages/table/normal.vue b/packages/table/normal.vue
index 24b3961..4144968 100644
--- a/packages/table/normal.vue
+++ b/packages/table/normal.vue
@@ -1,5 +1,6 @@
 <script>
 import { get } from '../utils';
+import { renderContext } from '../utils/vnode';
 
 // 标题渲染
 function headerRender(h, context, item) {
@@ -63,11 +64,15 @@ export default {
     const elTableColumns = createElTableColumns(h, context, columns);
     // 前置插槽
     const prependSlot = scopedSlots.prepend ? scopedSlots.prepend() : '';
+    // 左侧插槽
+    const leftSlot = scopedSlots.left ? scopedSlots.left() : '';
+    // 右侧插槽
+    const rightSlot = scopedSlots.right ? scopedSlots.right() : '';
     // 后置插槽
     const appendSlot = scopedSlots.append ? scopedSlots.append() : '';
     // 渲染组件时移除当前组件特有的props，避免透传不必要的参数
     delete context.columns;
-    return h('el-table', context, [prependSlot, ...elTableColumns, appendSlot]);
+    return h('el-table', renderContext(context), [prependSlot, leftSlot, ...elTableColumns, rightSlot, appendSlot]);
   },
 };
 </script>
diff --git a/packages/utils/vnode.js b/packages/utils/vnode.js
index 465b363..bdf35cb 100644
--- a/packages/utils/vnode.js
+++ b/packages/utils/vnode.js
@@ -16,7 +16,40 @@ export function registerRef(vnode, context) {
 
 // 简写注册ref
 export function ref(name, context) {
-  return registerRef(context._c(name, context), context);
+  const vnode = context._c(name, renderContext(context));
+  return registerRef(vnode, context);
+}
+
+// 清除attrs上的数组和对象，仅用props传递
+function clearAttrs(attrs) {
+  const newAttrs = Object.assign({}, attrs);
+  Object.keys(newAttrs).forEach(key => {
+    if (typeof newAttrs[key] === 'function' || typeof newAttrs[key] === 'object') {
+      delete newAttrs[key];
+    }
+  });
+  delete newAttrs.slot;
+  return newAttrs;
+}
+
+// 渲染函数式组件context
+export function renderContext(context) {
+  const result = {
+    staticClass: context.data.staticClass,
+    class: context.data.class,
+    staticStyle: context.data.staticStyle,
+    style: context.data.style,
+    attrs: clearAttrs(context.data.attrs),
+    props: context.props,
+    on: context.listeners,
+    directives: context.data.directives,
+    scopedSlots: context.scopedSlots,
+    slot: context.data.slot,
+    key: context.data.key,
+    ref: context.data.ref,
+    refInFor: true,
+  };
+  return result;
 }
 
 export default {
--
libgit2 0.21.0