feat(Dialog): content support CunstomComponent and VNode

* feat(table): tableData customrender by Columns.render

* feat(Dialog): content support CunstomComponent and VNode

Co-authored-by: undefined <undefined>

src/packages/__VUE/dialog/demo.vue

@@ -33,7 +33,7 @@
   </div>
 </template>
 <script lang="ts">
-import { ref } from 'vue';
+import { createVNode, ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { createDemo, translate } = createComponent('dialog');
 import { Dialog } from '@/packages/nutui.vue';
@@ -50,7 +50,8 @@ useTranslate({
     title2: 'Teleport 使用，挂载到指定节点',
     content: '支持函数调用和组件调用两种方式。',
     content1: '支持底部按钮纵向排列。',
-    content2: '打开开发者工具看一下 Elements Tab'
+    content2: '打开开发者工具看一下 Elements Tab',
+    content3: '我可以是一个自定义组件'
   },
   'en-US': {
     funUse: 'Function use',
@@ -63,7 +64,8 @@ useTranslate({
     title2: 'Teleport use, mount to the specified element node',
     content: 'Function call and template call are supported.',
     content1: 'Support vertical arrangement of bottom buttons.',
-    content2: 'Open the developer tool and take a look at the Elements tab'
+    content2: 'Open the developer tool and take a look at the Elements tab',
+    content3: 'I can be a custom component'
   }
 });
 export default createDemo({
@@ -81,7 +83,7 @@ export default createDemo({
     const baseClick = (): void => {
       Dialog({
         title: translate('basic'),
-        content: translate('content'),
+        content: createVNode('span', { style: { color: 'red' } }, translate('content3')),
         onCancel,
         onOk
       });

src/packages/__VUE/dialog/doc.en-US.md

@@ -10,7 +10,7 @@ The popup box component supports function call and component call.
 ### Install
     
 ```javascript
-import { createApp } from 'vue';
+import { createApp,createVNode } from 'vue';
 import { Dialog,Popup,OverLay } from '@nutui/nutui';
 
 const app = createApp();
@@ -44,7 +44,7 @@ export default {
         const baseClick = (): void => {
           Dialog({
             title: 'Basic spring frame',
-            content: 'Function call and component call are supported.',
+            content: createVNode('span', { style: { color: 'red' } }, 'I can be a custom component'),
             onCancel,
             onOk
           });

src/packages/__VUE/dialog/doc.md

@@ -10,7 +10,7 @@
 ### 安装
     
 ```javascript
-import { createApp } from 'vue';
+import { createApp,createVNode } from 'vue';
 import { Dialog,Popup,OverLay } from '@nutui/nutui';
 
 const app = createApp();
@@ -44,7 +44,7 @@ export default {
         const baseClick = (): void => {
           Dialog({
             title: '基础弹框',
-            content: '支持函数调用和组件调用两种方式。',
+            content: createVNode('span', { style: { color: 'red' } }, '我可以是一个自定义组件'),
             onCancel,
             onOk
           });
@@ -172,7 +172,7 @@ export default {
 |---------------------|---------------------------------------|----------|----------|
 | title               | 标题                                  | String   | -        |
 | id               | 标识符，相同时共用一个实例，默认为多个实例 | String/Number   | new Date().getTime()        |
-| content             | 内容，支持HTML                        | String   | -        |
+| content             | 内容，支持HTML和组件                     | String/VNode   | -        |
 | teleport            | 指定挂载节点                          | String   | "body"   |
 | closeOnClickOverlay | 点击蒙层是否关闭对话框                | Boolean  | false    |
 | noFooter            | 是否隐藏底部按钮栏                    | Boolean  | false    |
@@ -194,7 +194,7 @@ export default {
 | 字段                   | 说明                                     | 类型    | 默认值     |
 |------------------------|------------------------------------------|---------|------------|
 | title                  | 标题                                     | String  | -          |
-| content                | 内容，支持HTML                           | String  | -          |
+| content                | 内容，支持HTML和组件                       | String/VNode  | -          |
 | teleport               | 指定挂载节点                             | String  | "body"     |
 | close-on-click-overlay | 点击蒙层是否关闭对话框                   | Boolean | false      |
 | no-footer              | 是否隐藏底部按钮栏                       | Boolean | false      |

src/packages/__VUE/dialog/doc.taro.md

@@ -117,7 +117,7 @@ export default {
 | 字段                   | 说明                                     | 类型    | 默认值     |
 |------------------------|------------------------------------------|---------|------------|
 | title                  | 标题                                     | String  | -          |
-| content                | 内容，支持HTML                           | String  | -          |
+| content                | 内容，支持HTML和组件                       | String/VNode  | -          |
 | teleport               | 指定挂载节点                             | String  | "body"     |
 | close-on-click-overlay | 点击蒙层是否关闭对话框                   | Boolean | false      |
 | no-footer              | 是否隐藏底部按钮栏                       | Boolean | false      |

src/packages/__VUE/dialog/index.taro.vue

@@ -16,7 +16,8 @@
 
       <view class="nut-dialog__content" :style="{ textAlign }">
         <slot v-if="$slots.default" name="default"></slot>
-        <view v-else v-html="content"></view>
+        <view v-else-if="typeof content === 'string'" v-html="content"></view>
+        <component v-else :is="content" />
       </view>
 
       <view class="nut-dialog__footer" :class="{ [footerDirection]: footerDirection }" v-if="!noFooter">
@@ -41,7 +42,7 @@
   </nut-popup>
 </template>
 <script lang="ts">
-import { onMounted, computed, watch, ref } from 'vue';
+import { onMounted, computed, watch, ref, PropType, VNode } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create, translate } = createComponent('dialog');
 import Popup, { popupProps } from '../popup/index.taro.vue';
@@ -63,7 +64,7 @@ export default create({
       default: ''
     },
     content: {
-      type: String,
+      type: [String, Object] as PropType<string | VNode>,
       default: ''
     },
     noFooter: {

src/packages/__VUE/dialog/index.ts

@@ -1,12 +1,12 @@
 import Dialog from './index.vue';
-import { render, createVNode, h } from 'vue';
+import { render, createVNode, h, VNode } from 'vue';
 export class DialogOptions {
   title?: string = '';
-  content?: string = '';
+  content?: string | VNode = '';
   cancelText?: string = '';
   okText?: string = '';
   textAlign?: string = 'center';
-  teleport?: String | HTMLElement = 'body';
+  teleport?: string | HTMLElement = 'body';
   id?: string | number = new Date().getTime();
   footerDirection?: string = 'horizontal'; //使用横纵方向 可选值 horizontal、vertical
 

src/packages/__VUE/dialog/index.vue

@@ -16,7 +16,8 @@
 
       <view class="nut-dialog__content" :style="{ textAlign }">
         <slot v-if="$slots.default" name="default"></slot>
-        <view v-else v-html="content"></view>
+        <view v-else-if="typeof content === 'string'" v-html="content"></view>
+        <component v-else :is="content" />
       </view>
 
       <view class="nut-dialog__footer" :class="{ [footerDirection]: footerDirection }" v-if="!noFooter">
@@ -41,7 +42,7 @@
   </nut-popup>
 </template>
 <script lang="ts">
-import { onMounted, computed, watch, ref } from 'vue';
+import { onMounted, computed, watch, ref, PropType, VNode } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create, translate } = createComponent('dialog');
 import Popup, { popupProps } from '../popup/index.vue';
@@ -63,7 +64,7 @@ export default create({
       default: ''
     },
     content: {
-      type: String,
+      type: [String, Object] as PropType<string | VNode>,
       default: ''
     },
     noFooter: {