From cc70321ffb5e8c7a8d3d3f5fc0457272869daf40 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 11:26:08 +0800
Subject: [PATCH 01/17] =?UTF-8?q?style:=20=E8=83=8C=E6=99=AF=E9=A2=9C?=
 =?UTF-8?q?=E8=89=B2=E4=BD=BF=E7=94=A8=E5=8F=98=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/header/header.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/devui-vue/devui/table/src/header/header.scss b/packages/devui-vue/devui/table/src/header/header.scss
index 21e88bf4..3a8af9c9 100644
--- a/packages/devui-vue/devui/table/src/header/header.scss
+++ b/packages/devui-vue/devui/table/src/header/header.scss
@@ -20,7 +20,7 @@
 .header-bg {
   thead.devui-thead {
     tr {
-      background: var(--devui-list-item-hover-bg, #f2f5fc);
+      background: $devui-list-item-hover-bg;
     }
   }
 }
-- 
Gitee


From 5e7f86a6f7b2957378ea6c71a14dd2957249a8cc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 13:21:08 +0800
Subject: [PATCH 02/17] =?UTF-8?q?docs:=20=E5=A2=9E=E5=8A=A0=20api=20?=
 =?UTF-8?q?=E6=8F=8F=E8=BF=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui-vue/docs/components/table/index.md  | 134 ++++++++++++++++--
 1 file changed, 126 insertions(+), 8 deletions(-)

diff --git a/packages/devui-vue/docs/components/table/index.md b/packages/devui-vue/docs/components/table/index.md
index fb305b27..c9c1d5b0 100644
--- a/packages/devui-vue/docs/components/table/index.md
+++ b/packages/devui-vue/docs/components/table/index.md
@@ -8,9 +8,9 @@
 2. 当需要对数据进行排序、过滤、自定义操作等复杂行为时。
 
 ### 基本用法
+简单表格，`d-table`组件上的`data`属性传入要展示的数据，`d-table-column`组件上通过`field`传入对应列内容的字段名，`header`传入对应列的标题。
 
-:::demo 简单表格，`d-table`组件上的`data`属性传入要展示的数据，`d-table-column`组件上通过`field`传入对应列内容的字段名，`header`传入对应列的标题。
-
+:::demo 
 ```vue
 <template>
   <d-table :data="baseTableData">
@@ -59,13 +59,11 @@
 
 </script>
 ```
-
 :::
 
 ### 表格样式
 
 :::demo
-
 ```vue
 <template>
 <div class="table-btn-groups">
@@ -148,13 +146,12 @@
 }
 </style>
 ```
-
 :::
 
 ### 空数据模板
+当传入的数据为空时，默认展示空数据模板。
 
-:::demo 当传入的数据为空时，默认展示空数据模板。
-
+:::demo 
 ```vue
 <template>
   <div>
@@ -209,9 +206,127 @@
   })
 </script>
 ```
-
 :::
 
+### 固定表头
+使用`fix-header`设置表头固定，使之不跟随滚动。
+
+:::demo 
+```vue
+<template>
+  <d-table :data="baseTableData">
+    <d-column field="firstName" header="First Name"></d-column>
+    <d-column field="lastName" header="Last Name"></d-column>
+    <d-column field="gender" header="Gender"></d-column>
+    <d-column field="date" header="Date of birth"></d-column>
+  </d-table>
+</template>
+
+<script>
+  import { defineComponent, ref } from 'vue'
+
+  export default defineComponent({
+    setup() {
+      const baseTableData = ref([
+        {
+          firstName: 'Mark',
+          lastName: 'Otto',
+          date: '1990/01/11',
+          gender: 'Male',
+        },
+        {
+          firstName: 'Jacob',
+          lastName: 'Thornton',
+          gender: 'Female',
+          date: '1990/01/12',
+        },
+        {
+          firstName: 'Danni',
+          lastName: 'Chen',
+          gender: 'Male',
+          date: '1990/01/13',
+        },
+        {
+          firstName: 'green1',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green2',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green3',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green4',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green5',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green6',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green7',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green8',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green9',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green10',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green11',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green12',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        }
+      ])
+
+      return { baseTableData }
+    }
+  })
+
+</script>
+```
+:::
 
 ### d-table Props
 
@@ -221,6 +336,9 @@
 | striped      | `Boolean`           | `false`   | 是否显示斑马纹间隔       |
 | header-bg    | `Boolean`           | `false`   | 可选，表头是否显示背景色 |
 | table-layout | `String` | `'fixed'` | 表格布局，可选值为`'auto'`|
+| scrollable	 | `Boolean` | `true` | 可选，表格在超出容器时，是否可以通过滚动查看表格内容|
+| max-height   | `Number` | -- | 可选，限制最大高度	|
+| fix-header   | `Boolean` | `false` | 可选，表头是否固定	|
 
 ### d-column Props
 
-- 
Gitee


From d4fee3962ed318227a8ba3583dd019ca2a6f94cd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 13:41:10 +0800
Subject: [PATCH 03/17] =?UTF-8?q?style:=20=E4=BC=98=E5=8C=96=20class=20?=
 =?UTF-8?q?=E5=90=8D=E7=A7=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.scss   | 7 ++++---
 packages/devui-vue/devui/table/src/use-table.ts | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/table.scss b/packages/devui-vue/devui/table/src/table.scss
index 48d9e7cf..648f5400 100644
--- a/packages/devui-vue/devui/table/src/table.scss
+++ b/packages/devui-vue/devui/table/src/table.scss
@@ -23,8 +23,9 @@
     font-size: $devui-font-size;
     text-align: center;
   }
-}
 
-.table-layout-auto {
-  table-layout: auto;
+  &-layout-auto {
+    table-layout: auto;
+  }
 }
+
diff --git a/packages/devui-vue/devui/table/src/use-table.ts b/packages/devui-vue/devui/table/src/use-table.ts
index e375cbbb..65895c4a 100644
--- a/packages/devui-vue/devui/table/src/use-table.ts
+++ b/packages/devui-vue/devui/table/src/use-table.ts
@@ -6,7 +6,7 @@ export function useTable(props: TablePropsTypes): any {
     'devui-table': true,
     'devui-table-striped': props.striped,
     'header-bg': props.headerBg,
-    'table-layout-auto': props.tableLayout === 'auto'
+    'devui-table-layout-auto': props.tableLayout === 'auto'
   }));
 
   return { classes };
-- 
Gitee


From b42926561f6f9f98037badf41d5f677af4f5678d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 14:03:10 +0800
Subject: [PATCH 04/17] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=20max-height?=
 =?UTF-8?q?=20=E5=8F=98=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.type.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/packages/devui-vue/devui/table/src/table.type.ts b/packages/devui-vue/devui/table/src/table.type.ts
index b9132f45..d84e1192 100644
--- a/packages/devui-vue/devui/table/src/table.type.ts
+++ b/packages/devui-vue/devui/table/src/table.type.ts
@@ -1,4 +1,5 @@
 import { PropType, ExtractPropTypes, ComponentInternalInstance } from 'vue';
+export type ModelValue = number | string
 
 export const TableProps = {
   data: {
@@ -16,6 +17,10 @@ export const TableProps = {
   tableLayout:{
     type: String as PropType<'fixed' | 'auto'>,
     default: 'fixed'
+  },
+  maxHeight: {
+    type: [Number, String] as PropType<ModelValue>,
+    default: 236
   }
 };
 
-- 
Gitee


From 0c0990d96429eae0c85b54f6a879390dafc2e88e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 14:19:19 +0800
Subject: [PATCH 05/17] =?UTF-8?q?refactor:=20=E7=9B=B4=E6=8E=A5=E5=9C=A8?=
 =?UTF-8?q?=20setup=20=E4=B8=AD=20return=20=E5=87=BA=E5=8E=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.tsx | 25 +++++++++-----------
 1 file changed, 11 insertions(+), 14 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/table.tsx b/packages/devui-vue/devui/table/src/table.tsx
index 83146778..a0233a25 100644
--- a/packages/devui-vue/devui/table/src/table.tsx
+++ b/packages/devui-vue/devui/table/src/table.tsx
@@ -10,27 +10,24 @@ import './table.scss';
 export default defineComponent({
   name: 'DTable',
   props: TableProps,
-  setup(props: TablePropsTypes) {
+  setup(props: TablePropsTypes, ctx) {
+    const { slots } = ctx;
     const table = getCurrentInstance() as Table;
     const store = createStore(props);
     table.store = store;
     const { classes } = useTable(props);
     provide('table', table);
-
-    return { classes, store };
-  },
-  render() {
-    const { classes, data, store, $slots } = this;
-    return (
-      <div class="devui-table-wrapper">
-        {$slots.default()}
-        <table class={classes} cellpadding="0" cellspacing="0">
+    
+    return () => {
+      return <div class="devui-table-wrapper">
+        {slots.default?.()}
+        <table class={classes.value} cellpadding="0" cellspacing="0">
           <ColGroup />
           <TableHeader store={store} />
-          {!!data.length && <TableBody store={store} />}
+          {!!props.data.length && <TableBody store={store} />}
         </table>
-        {!data.length && <div class="devui-table-empty">No Data</div>}
+        {!props.data.length && <div class="devui-table-empty">No Data</div>}
       </div>
-    );
-  },
+    }
+  }
 });
-- 
Gitee


From b5cd465854e7777af061747eb0662ff8591de2e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 14:26:34 +0800
Subject: [PATCH 06/17] =?UTF-8?q?refactor:=20=E7=9B=B4=E6=8E=A5=E5=9C=A8?=
 =?UTF-8?q?=20setup=20=E4=B8=AD=20return=20=E5=87=BA=E5=8E=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/body/body.tsx | 15 +++++----------
 1 file changed, 5 insertions(+), 10 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/body/body.tsx b/packages/devui-vue/devui/table/src/body/body.tsx
index 9b02b867..49374305 100644
--- a/packages/devui-vue/devui/table/src/body/body.tsx
+++ b/packages/devui-vue/devui/table/src/body/body.tsx
@@ -9,14 +9,9 @@ export default defineComponent({
   setup(props: TableBodyPropsTypes) {
     const { rowColumns } = useTableBody(props);
 
-    return { rowColumns };
-  },
-  render() {
-    const { rowColumns } = this;
-
-    return (
-      <tbody class="devui-tbody">
-        {rowColumns.map((row, rowIndex) => {
+    return () => {
+      return <tbody class="devui-tbody">
+        {rowColumns.value.map((row, rowIndex) => {
           return (
             <tr key={rowIndex}>
               {row.columns.map((column, index) => {
@@ -28,6 +23,6 @@ export default defineComponent({
           );
         })}
       </tbody>
-    );
-  },
+    }
+  }
 });
\ No newline at end of file
-- 
Gitee


From 2992dfe11bdbeb48ca438333b635c7b14a28701d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 14:52:33 +0800
Subject: [PATCH 07/17] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=20maxHeight?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/table.tsx b/packages/devui-vue/devui/table/src/table.tsx
index a0233a25..2f4bc4b9 100644
--- a/packages/devui-vue/devui/table/src/table.tsx
+++ b/packages/devui-vue/devui/table/src/table.tsx
@@ -17,9 +17,17 @@ export default defineComponent({
     table.store = store;
     const { classes } = useTable(props);
     provide('table', table);
-    
+
+    function getMaxHeight(maxHeight){
+      let res = maxHeight
+      if (typeof maxHeight === 'number') {
+        res += 'px';
+      }
+      return `max-height: ${res};`
+    }
+
     return () => {
-      return <div class="devui-table-wrapper">
+      return <div class="devui-table-wrapper" style={getMaxHeight(props.maxHeight)}>
         {slots.default?.()}
         <table class={classes.value} cellpadding="0" cellspacing="0">
           <ColGroup />
-- 
Gitee


From 3d92e648c17fd26ca7321dab49384745d6894a9c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 15:27:35 +0800
Subject: [PATCH 08/17] =?UTF-8?q?feat=EF=BC=9A=E5=A2=9E=E5=8A=A0=20scrolla?=
 =?UTF-8?q?ble=20api?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.tsx  | 26 ++++++++++++++-----
 .../devui-vue/devui/table/src/table.type.ts   |  6 ++++-
 2 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/table.tsx b/packages/devui-vue/devui/table/src/table.tsx
index 2f4bc4b9..e1299847 100644
--- a/packages/devui-vue/devui/table/src/table.tsx
+++ b/packages/devui-vue/devui/table/src/table.tsx
@@ -18,16 +18,28 @@ export default defineComponent({
     const { classes } = useTable(props);
     provide('table', table);
 
-    function getMaxHeight(maxHeight){
-      let res = maxHeight
-      if (typeof maxHeight === 'number') {
-        res += 'px';
-      }
-      return `max-height: ${res};`
+    
+    function getWrapperStyle(maxHeight,scrollable){
+      let res = '';
+
+      (function getMaxHeight(){
+        if (typeof maxHeight === 'number') {
+          res += `max-height: ${maxHeight}px;`
+        }else{
+          res += `max-height: ${maxHeight};`
+        }
+      })();
+      (function getScrollable(){
+        if (!scrollable) {
+          res += 'overflow: hidden;'
+        }
+      })();
+
+      return res
     }
 
     return () => {
-      return <div class="devui-table-wrapper" style={getMaxHeight(props.maxHeight)}>
+      return <div class="devui-table-wrapper" style={getWrapperStyle(props.maxHeight,props.scrollable)}>
         {slots.default?.()}
         <table class={classes.value} cellpadding="0" cellspacing="0">
           <ColGroup />
diff --git a/packages/devui-vue/devui/table/src/table.type.ts b/packages/devui-vue/devui/table/src/table.type.ts
index d84e1192..43578a60 100644
--- a/packages/devui-vue/devui/table/src/table.type.ts
+++ b/packages/devui-vue/devui/table/src/table.type.ts
@@ -21,8 +21,12 @@ export const TableProps = {
   maxHeight: {
     type: [Number, String] as PropType<ModelValue>,
     default: 236
+  },
+  scrollable: {
+    type: Boolean,
+    default: true
   }
-};
+} as const
 
 export type TablePropsTypes = ExtractPropTypes<typeof TableProps>;
 
-- 
Gitee


From 157398fa5d743212f2ffb4fe0890a45489759d95 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 16:07:28 +0800
Subject: [PATCH 09/17] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=20maxHeight=20?=
 =?UTF-8?q?=E9=BB=98=E8=AE=A4=E5=80=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.type.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/devui-vue/devui/table/src/table.type.ts b/packages/devui-vue/devui/table/src/table.type.ts
index 43578a60..3199415b 100644
--- a/packages/devui-vue/devui/table/src/table.type.ts
+++ b/packages/devui-vue/devui/table/src/table.type.ts
@@ -20,7 +20,7 @@ export const TableProps = {
   },
   maxHeight: {
     type: [Number, String] as PropType<ModelValue>,
-    default: 236
+    default: 342
   },
   scrollable: {
     type: Boolean,
-- 
Gitee


From 84069ae9c04578905dd248f28e8fab30c71f653a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 16:15:05 +0800
Subject: [PATCH 10/17] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E5=9B=BA?=
 =?UTF-8?q?=E5=AE=9A=E8=A1=A8=E5=A4=B4=E5=8F=98=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.type.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/devui-vue/devui/table/src/table.type.ts b/packages/devui-vue/devui/table/src/table.type.ts
index 3199415b..23168f7e 100644
--- a/packages/devui-vue/devui/table/src/table.type.ts
+++ b/packages/devui-vue/devui/table/src/table.type.ts
@@ -25,6 +25,10 @@ export const TableProps = {
   scrollable: {
     type: Boolean,
     default: true
+  },
+  fixHeader: {
+    type: Boolean,
+    default: false
   }
 } as const
 
-- 
Gitee


From 367bb946ac880372742dcb55f05d0f70c6c0ca27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 16:15:16 +0800
Subject: [PATCH 11/17] =?UTF-8?q?docs:=20=E4=BF=AE=E6=94=B9=E9=BB=98?=
 =?UTF-8?q?=E8=AE=A4=E5=80=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/docs/components/table/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/devui-vue/docs/components/table/index.md b/packages/devui-vue/docs/components/table/index.md
index c9c1d5b0..8eb054f4 100644
--- a/packages/devui-vue/docs/components/table/index.md
+++ b/packages/devui-vue/docs/components/table/index.md
@@ -337,7 +337,7 @@
 | header-bg    | `Boolean`           | `false`   | 可选，表头是否显示背景色 |
 | table-layout | `String` | `'fixed'` | 表格布局，可选值为`'auto'`|
 | scrollable	 | `Boolean` | `true` | 可选，表格在超出容器时，是否可以通过滚动查看表格内容|
-| max-height   | `Number` | -- | 可选，限制最大高度	|
+| max-height   | `Number` | `342` | 可选，限制最大高度	|
 | fix-header   | `Boolean` | `false` | 可选，表头是否固定	|
 
 ### d-column Props
-- 
Gitee


From 639a860465d52dd10025031c87398bd2f934a4d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Thu, 28 Oct 2021 16:31:51 +0800
Subject: [PATCH 12/17] =?UTF-8?q?refactor:=20=E7=9B=B4=E6=8E=A5=E5=9C=A8?=
 =?UTF-8?q?=20setup=20=E4=B8=AD=20return=20=E5=87=BA=E5=8E=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui/table/src/colgroup/colgroup.tsx     | 20 ++++++++-----------
 1 file changed, 8 insertions(+), 12 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/colgroup/colgroup.tsx b/packages/devui-vue/devui/table/src/colgroup/colgroup.tsx
index 93e7197d..1a9e123f 100644
--- a/packages/devui-vue/devui/table/src/colgroup/colgroup.tsx
+++ b/packages/devui-vue/devui/table/src/colgroup/colgroup.tsx
@@ -8,16 +8,12 @@ export default defineComponent({
     const parent: Table = inject('table');
     const columns: Column[] = parent.store.states._columns;
 
-    return { columns };
-  },
-  render() {
-    const { columns } = this;
-    return (
-      <colgroup>
-        {columns.map((column, index) => {
-          return <col key={index} width={column.realWidth}></col>;
-        })}
-      </colgroup>
-    );
-  },
+    return () => {
+      return <colgroup>
+      {columns._value.map((column, index) => {
+        return <col key={index} width={column.realWidth}></col>;
+      })}
+    </colgroup>
+    }
+  }
 });
\ No newline at end of file
-- 
Gitee


From e7161e01e86703c3d58b3ebbc94e07be2710b70b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Fri, 29 Oct 2021 10:24:25 +0800
Subject: [PATCH 13/17] =?UTF-8?q?refactor:=20=E7=9B=B4=E6=8E=A5=E5=9C=A8?=
 =?UTF-8?q?=20setup=20=E4=B8=AD=20return=20=E5=87=BA=E5=8E=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/column/column.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/column/column.tsx b/packages/devui-vue/devui/table/src/column/column.tsx
index 60ef5e04..e6dec6f9 100644
--- a/packages/devui-vue/devui/table/src/column/column.tsx
+++ b/packages/devui-vue/devui/table/src/column/column.tsx
@@ -26,8 +26,9 @@ export default defineComponent({
     onMounted(() => {
       parent.store.insertColumn(column);
     });
-  },
-  render() {
-    return null;
-  },
+
+    return () => {
+      return null
+    }
+  }
 });
\ No newline at end of file
-- 
Gitee


From cf7af2dfc7a686c68a690c022fb2068cd0e462be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Fri, 29 Oct 2021 10:29:30 +0800
Subject: [PATCH 14/17] =?UTF-8?q?refactor:=20=E7=9B=B4=E6=8E=A5=E5=9C=A8?=
 =?UTF-8?q?=20setup=20=E4=B8=AD=20return=20=E5=87=BA=E5=8E=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui/table/src/header/header.tsx         | 22 +++++++------------
 1 file changed, 8 insertions(+), 14 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/header/header.tsx b/packages/devui-vue/devui/table/src/header/header.tsx
index a05a80b7..73288079 100644
--- a/packages/devui-vue/devui/table/src/header/header.tsx
+++ b/packages/devui-vue/devui/table/src/header/header.tsx
@@ -9,20 +9,14 @@ export default defineComponent({
     const { store } = toRefs(props)
     const columns = store.value.states._columns.value;
 
-    return {
-      columns,
+    return () => {
+      return <thead class="devui-thead">
+      <tr>
+        {columns.map((column, index) => {
+          return <th key={index}>{column.renderHeader()}</th>;
+        })}
+      </tr>
+    </thead>
     }
-  },
-  render() {
-    const { columns } = this
-    return (
-      <thead class="devui-thead">
-        <tr>
-          {columns.map((column, index) => {
-            return <th key={index}>{column.renderHeader()}</th>;
-          })}
-        </tr>
-      </thead>
-    )
   }
 });
\ No newline at end of file
-- 
Gitee


From 7eae156441a30df851b0455c3ab51a15b045f418 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Fri, 29 Oct 2021 11:23:49 +0800
Subject: [PATCH 15/17] =?UTF-8?q?feat:=20=E5=AE=9E=E7=8E=B0=E5=9B=BA?=
 =?UTF-8?q?=E5=AE=9A=E8=A1=A8=E5=A4=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.tsx  |  39 ++--
 .../devui-vue/docs/components/table/index.md  | 181 ++++++------------
 2 files changed, 83 insertions(+), 137 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/table.tsx b/packages/devui-vue/devui/table/src/table.tsx
index e1299847..47600b55 100644
--- a/packages/devui-vue/devui/table/src/table.tsx
+++ b/packages/devui-vue/devui/table/src/table.tsx
@@ -18,20 +18,24 @@ export default defineComponent({
     const { classes } = useTable(props);
     provide('table', table);
 
-    
-    function getWrapperStyle(maxHeight,scrollable){
+    function getScrollable(scrollable) {
+      if (!scrollable) {
+        return 'overflow: hidden;'
+      }
+    }
+    function getBodyStyle(maxHeight,isHeaderFixed) {
       let res = '';
 
-      (function getMaxHeight(){
+      (function getMaxHeight() {
         if (typeof maxHeight === 'number') {
           res += `max-height: ${maxHeight}px;`
-        }else{
+        } else {
           res += `max-height: ${maxHeight};`
         }
       })();
-      (function getScrollable(){
-        if (!scrollable) {
-          res += 'overflow: hidden;'
+      (function setHeaderFixed(){
+        if (isHeaderFixed) {
+          res += 'overflow-y: scroll;'
         }
       })();
 
@@ -39,14 +43,21 @@ export default defineComponent({
     }
 
     return () => {
-      return <div class="devui-table-wrapper" style={getWrapperStyle(props.maxHeight,props.scrollable)}>
+      return <div class="devui-table-wrapper" style={getScrollable(props.scrollable)}>
         {slots.default?.()}
-        <table class={classes.value} cellpadding="0" cellspacing="0">
-          <ColGroup />
-          <TableHeader store={store} />
-          {!!props.data.length && <TableBody store={store} />}
-        </table>
-        {!props.data.length && <div class="devui-table-empty">No Data</div>}
+        <div class="devui-table-header">
+          <table class={classes.value} cellpadding="0" cellspacing="0">
+            <ColGroup />
+            <TableHeader store={store} />
+          </table>
+        </div>
+        <div class="devui-table-body" style={getBodyStyle(props.maxHeight,props.fixHeader)}>
+          <table class={classes.value} cellpadding="0" cellspacing="0">
+            <ColGroup />
+            {!!props.data.length && <TableBody store={store} />}
+          </table>
+          {!props.data.length && <div class="devui-table-empty">No Data</div>}
+        </div>
       </div>
     }
   }
diff --git a/packages/devui-vue/docs/components/table/index.md b/packages/devui-vue/docs/components/table/index.md
index 8eb054f4..39458cec 100644
--- a/packages/devui-vue/docs/components/table/index.md
+++ b/packages/devui-vue/docs/components/table/index.md
@@ -79,8 +79,12 @@
           表头背景色：
          <d-switch v-model:checked="headerBg" />
       </div>
+      <div class="table-btn">
+          固定表头：
+         <d-switch v-model:checked="fixHeader" />
+      </div>
   </div>
-  <d-table :table-layout="tableLayout?'auto':'fixed'" :striped="striped" :header-bg="headerBg" :data="stripedTableData">
+  <d-table :table-layout="tableLayout?'auto':'fixed'" :striped="striped" :header-bg="headerBg" :data="stripedTableData" :fix-header="fixHeader">
     <d-column field="firstName" header="First Name"></d-column>
     <d-column field="lastName" header="Last Name"></d-column>
     <d-column field="gender" header="Gender"></d-column>
@@ -97,6 +101,7 @@
       const tableLayout = ref(false)
       const striped = ref(false)
       const headerBg = ref(false)
+      const fixHeader = ref(false)
       const stripedTableData = ref([
         {
           firstName: 'Mark',
@@ -117,7 +122,55 @@
           date: '1990/01/13',
         },
         {
-          firstName: 'green',
+          firstName: 'green 1',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 2',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 3',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 4',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 5',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 6',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 7',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 8',
+          lastName: 'gerong',
+          gender: 'Male',
+          date: '1990/01/14',
+        },
+        {
+          firstName: 'green 9',
           lastName: 'gerong',
           gender: 'Male',
           date: '1990/01/14',
@@ -128,7 +181,8 @@
         stripedTableData,
         striped,
         headerBg,
-        tableLayout 
+        tableLayout,
+        fixHeader 
       }
     }
   })
@@ -197,7 +251,7 @@
             lastName: 'Yu',
             gender: 'Female',
             date: '1990/01/18',
-          }
+          },
         ]
       }
 
@@ -208,125 +262,6 @@
 ```
 :::
 
-### 固定表头
-使用`fix-header`设置表头固定，使之不跟随滚动。
-
-:::demo 
-```vue
-<template>
-  <d-table :data="baseTableData">
-    <d-column field="firstName" header="First Name"></d-column>
-    <d-column field="lastName" header="Last Name"></d-column>
-    <d-column field="gender" header="Gender"></d-column>
-    <d-column field="date" header="Date of birth"></d-column>
-  </d-table>
-</template>
-
-<script>
-  import { defineComponent, ref } from 'vue'
-
-  export default defineComponent({
-    setup() {
-      const baseTableData = ref([
-        {
-          firstName: 'Mark',
-          lastName: 'Otto',
-          date: '1990/01/11',
-          gender: 'Male',
-        },
-        {
-          firstName: 'Jacob',
-          lastName: 'Thornton',
-          gender: 'Female',
-          date: '1990/01/12',
-        },
-        {
-          firstName: 'Danni',
-          lastName: 'Chen',
-          gender: 'Male',
-          date: '1990/01/13',
-        },
-        {
-          firstName: 'green1',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green2',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green3',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green4',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green5',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green6',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green7',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green8',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green9',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green10',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green11',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        },
-        {
-          firstName: 'green12',
-          lastName: 'gerong',
-          gender: 'Male',
-          date: '1990/01/14',
-        }
-      ])
-
-      return { baseTableData }
-    }
-  })
-
-</script>
-```
-:::
 
 ### d-table Props
 
-- 
Gitee


From 80daa5bebb8c1aaf8d07e1125931c51fc3f60b17 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Mon, 1 Nov 2021 16:46:59 +0800
Subject: [PATCH 16/17] =?UTF-8?q?feat(table):=20=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E8=BE=B9=E6=A1=86=20api?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.scss     | 12 ++++++++----
 packages/devui-vue/devui/table/src/table.tsx      |  2 +-
 packages/devui-vue/devui/table/src/table.type.ts  |  4 ++++
 packages/devui-vue/devui/table/src/use-table.ts   |  5 +++--
 packages/devui-vue/docs/components/table/index.md | 10 ++++++++--
 5 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/packages/devui-vue/devui/table/src/table.scss b/packages/devui-vue/devui/table/src/table.scss
index 648f5400..56f47506 100644
--- a/packages/devui-vue/devui/table/src/table.scss
+++ b/packages/devui-vue/devui/table/src/table.scss
@@ -7,25 +7,29 @@
   border-spacing: 0;
   border: none;
 
-  &-wrapper {
+  &_wrapper {
     width: 100%;
     overflow-x: auto;
   }
 
-  &-striped {
+  &_striped {
     tbody tr:nth-child(even) {
       background-color: $devui-list-item-strip-bg;
     }
   }
 
-  &-empty {
+  &_empty {
     width: 100%;
     font-size: $devui-font-size;
     text-align: center;
   }
 
-  &-layout-auto {
+  &_layout-auto {
     table-layout: auto;
   }
+
+  &_bordered {
+    border: 1px solid #adb0b8;
+  }
 }
 
diff --git a/packages/devui-vue/devui/table/src/table.tsx b/packages/devui-vue/devui/table/src/table.tsx
index 47600b55..d5753a50 100644
--- a/packages/devui-vue/devui/table/src/table.tsx
+++ b/packages/devui-vue/devui/table/src/table.tsx
@@ -56,7 +56,7 @@ export default defineComponent({
             <ColGroup />
             {!!props.data.length && <TableBody store={store} />}
           </table>
-          {!props.data.length && <div class="devui-table-empty">No Data</div>}
+          {!props.data.length && <div class="devui-table_empty">No Data</div>}
         </div>
       </div>
     }
diff --git a/packages/devui-vue/devui/table/src/table.type.ts b/packages/devui-vue/devui/table/src/table.type.ts
index 23168f7e..22561d61 100644
--- a/packages/devui-vue/devui/table/src/table.type.ts
+++ b/packages/devui-vue/devui/table/src/table.type.ts
@@ -14,6 +14,10 @@ export const TableProps = {
     type: Boolean,
     default: false
   },
+  borderType:{
+    type: String as PropType<'borderless' | 'bordered'>,
+    default: 'borderless'
+  },
   tableLayout:{
     type: String as PropType<'fixed' | 'auto'>,
     default: 'fixed'
diff --git a/packages/devui-vue/devui/table/src/use-table.ts b/packages/devui-vue/devui/table/src/use-table.ts
index 65895c4a..2a4358d9 100644
--- a/packages/devui-vue/devui/table/src/use-table.ts
+++ b/packages/devui-vue/devui/table/src/use-table.ts
@@ -4,9 +4,10 @@ import { TablePropsTypes } from './table.type';
 export function useTable(props: TablePropsTypes): any {
   const classes = computed(() => ({
     'devui-table': true,
-    'devui-table-striped': props.striped,
+    'devui-table_striped': props.striped,
     'header-bg': props.headerBg,
-    'devui-table-layout-auto': props.tableLayout === 'auto'
+    'devui-table_layout-auto': props.tableLayout === 'auto',
+    'devui-table_bordered': props.borderType === 'bordered'
   }));
 
   return { classes };
diff --git a/packages/devui-vue/docs/components/table/index.md b/packages/devui-vue/docs/components/table/index.md
index 39458cec..a1062fe2 100644
--- a/packages/devui-vue/docs/components/table/index.md
+++ b/packages/devui-vue/docs/components/table/index.md
@@ -71,6 +71,10 @@
           自动表格布局：
          <d-switch v-model:checked="tableLayout" />
       </div>
+      <div class="table-btn">
+          外边框：
+         <d-switch v-model:checked="borderType" />
+      </div>
       <div class="table-btn">
           斑马纹：
          <d-switch v-model:checked="striped" />
@@ -84,7 +88,7 @@
          <d-switch v-model:checked="fixHeader" />
       </div>
   </div>
-  <d-table :table-layout="tableLayout?'auto':'fixed'" :striped="striped" :header-bg="headerBg" :data="stripedTableData" :fix-header="fixHeader">
+  <d-table :table-layout="tableLayout?'auto':'fixed'" :border-type="borderType?'bordered':'borderless'" :striped="striped" :header-bg="headerBg" :data="stripedTableData" :fix-header="fixHeader">
     <d-column field="firstName" header="First Name"></d-column>
     <d-column field="lastName" header="Last Name"></d-column>
     <d-column field="gender" header="Gender"></d-column>
@@ -102,6 +106,7 @@
       const striped = ref(false)
       const headerBg = ref(false)
       const fixHeader = ref(false)
+      const borderType = ref(false)
       const stripedTableData = ref([
         {
           firstName: 'Mark',
@@ -182,6 +187,7 @@
         striped,
         headerBg,
         tableLayout,
+        borderType,
         fixHeader 
       }
     }
@@ -271,7 +277,7 @@
 | striped      | `Boolean`           | `false`   | 是否显示斑马纹间隔       |
 | header-bg    | `Boolean`           | `false`   | 可选，表头是否显示背景色 |
 | table-layout | `String` | `'fixed'` | 表格布局，可选值为`'auto'`|
-| scrollable	 | `Boolean` | `true` | 可选，表格在超出容器时，是否可以通过滚动查看表格内容|
+| border-type	 | `String` | `'borderless'` | 可选，表格边框类型，默认无外边框，`'bordered'`全边框。|
 | max-height   | `Number` | `342` | 可选，限制最大高度	|
 | fix-header   | `Boolean` | `false` | 可选，表头是否固定	|
 
-- 
Gitee


From 82415720d89a71982d4e3ed2617f75a88e6bf8f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E5=A3=B0?= <ivestszheng@qq.com>
Date: Mon, 1 Nov 2021 16:48:46 +0800
Subject: [PATCH 17/17] =?UTF-8?q?style(table):=20=E9=A2=9C=E8=89=B2?=
 =?UTF-8?q?=E7=94=A8=E5=8F=98=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/devui-vue/devui/table/src/table.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/devui-vue/devui/table/src/table.scss b/packages/devui-vue/devui/table/src/table.scss
index 56f47506..57077b0c 100644
--- a/packages/devui-vue/devui/table/src/table.scss
+++ b/packages/devui-vue/devui/table/src/table.scss
@@ -29,7 +29,7 @@
   }
 
   &_bordered {
-    border: 1px solid #adb0b8;
+    border: 1px solid $devui-line;
   }
 }
 
-- 
Gitee