diff --git a/examples/dialog/demos/attach.vue b/examples/dialog/demos/attach.vue
index 731f1f09c..dd0ed9a7a 100644
--- a/examples/dialog/demos/attach.vue
+++ b/examples/dialog/demos/attach.vue
@@ -90,7 +90,4 @@ export default Vue.extend({
   border-radius: 2px;
   overflow: hidden;
 }
-body {
-  width: 3000px;
-}
 </style>
diff --git a/examples/table/demos/affix.vue b/examples/table/demos/affix.vue
new file mode 100644
index 000000000..e4054b73d
--- /dev/null
+++ b/examples/table/demos/affix.vue
@@ -0,0 +1,157 @@
+<template>
+  <!-- 注意组件父元素的宽度 -->
+  <div class="tdesign-demo-block-column-large tdesign-demo__table-affix" style="width: 100%">
+    <div>
+      <t-checkbox v-model="headerAffixedTop">表头吸顶</t-checkbox>
+      <t-checkbox v-model="footerAffixedBottom" style="margin-left: 32px">表尾吸底</t-checkbox>
+      <t-checkbox v-model="fixedLeftColumn" style="margin-left: 32px">固定左侧列</t-checkbox>
+      <t-checkbox v-model="fixedRightColumn" style="margin-left: 32px">固定右侧列</t-checkbox>
+    </div>
+    <t-table
+      rowKey="index"
+      :data="data"
+      :columns="columns"
+      :foot-data="footData"
+      :rowClassName="rowClassName"
+      :headerAffixedTop="headerAffixedTop"
+      :footerAffixedBottom="footerAffixedBottom"
+      :headerAffixProps="{ offsetTop: 87, zIndex: 1000 }"
+      :footerAffixProps="{ offsetBottom: 0, zIndex: 1000 }"
+      tableLayout="auto"
+      bordered
+      allowResizeColumnWidth
+    >
+      <template #t-foot-required> 插槽渲染表尾 </template>
+    </t-table>
+    <!-- <t-affix :offsetBottom="100">
+      <div>456</div>
+    </t-affix> -->
+    <!-- <div style="height: 200px;"></div> -->
+  </div>
+</template>
+<script lang="jsx">
+function getData(count) {
+  const data = [];
+  for (let i = 0; i < count; i++) {
+    data.push({
+      index: i,
+      platform: i % 2 === 0 ? '共有' : '私有',
+      type: ['String', 'Number', 'Array', 'Object'][i % 4],
+      default: ['-', '0', '[]', '{}'][i % 4],
+      detail: {
+        position: `读取 ${i} 个数据的嵌套信息值`,
+      },
+      required: i % 4 === 0 ? '是' : '否',
+      description: '数据源',
+    });
+  }
+  return data;
+}
+
+export default {
+  data() {
+    return {
+      data: getData(8),
+      // 如果在预渲染场景下，初次渲染的表格宽度和最终呈现宽度不一样，请异步设置表头吸顶
+      headerAffixedTop: true,
+      footerAffixedBottom: true,
+      fixedLeftColumn: true,
+      fixedRightColumn: true,
+      // 表尾有一行数据
+      footData: [{ type: '全部类型', description: '-' }],
+    };
+  },
+
+  computed: {
+    columns() {
+      return [
+        {
+          align: 'center',
+          className: 'row',
+          colKey: 'index',
+          title: '序号',
+          foot: () => <b style="color: rgb(0, 82, 217)">表尾</b>,
+          fixed: this.fixedLeftColumn ? 'left' : undefined,
+        },
+        {
+          colKey: 'platform',
+          title: '平台',
+          foot: (h, { rowIndex }) => <span>第 {rowIndex + 1} 行</span>,
+        },
+        {
+          colKey: 'type',
+          title: '类型',
+        },
+        {
+          colKey: 'expo',
+          title: '曝光',
+          cell: () => '-',
+          foot: '-',
+        },
+        {
+          colKey: 'click',
+          title: '点击',
+          cell: () => '-',
+          foot: '-',
+        },
+        {
+          colKey: 'ctr',
+          title: '点击率',
+          cell: () => '-',
+          foot: '-',
+        },
+        {
+          colKey: 'default',
+          title: '默认值',
+          foot: (h, { row }) => <span>{row.default || '空'}</span>,
+        },
+        {
+          colKey: 'required',
+          title: '是否必传',
+          // 使用插槽渲染，插槽名称为 't-foot-required'
+          foot: 't-foot-required',
+        },
+        {
+          colKey: 'detail.position',
+          title: '详情信息',
+          ellipsis: true,
+          foot: () => <div>渲染函数输出表尾信息</div>,
+        },
+        {
+          colKey: 'operation',
+          title: '操作',
+          cell: () => '查看',
+          width: 80,
+          foot: '-',
+          fixed: this.fixedRightColumn ? 'right' : undefined,
+        },
+      ];
+    },
+  },
+
+  methods: {
+    // type 可选值：foot 和 body
+    rowClassName({ type }) {
+      if (type === 'foot') return 't-tdesign__custom-footer-tr';
+      return 't-tdesign__custom-body-tr';
+    },
+    getContainer() {
+      return document.body;
+    },
+  },
+};
+</script>
+
+<style>
+/*
+ * table-layout: auto 模式下，table 元素的宽度设置很重要很重要。
+ * 如果不设置，列多了之后会挤在一起
+ * **/
+.tdesign-demo__table-affix table {
+  width: 1000px;
+}
+
+.tdesign-demo__table-affix .t-table {
+  max-width: 800px;
+}
+</style>
diff --git a/examples/table/demos/fixed-header-col.vue b/examples/table/demos/fixed-header-col.vue
index 34e862636..9e41043a6 100644
--- a/examples/table/demos/fixed-header-col.vue
+++ b/examples/table/demos/fixed-header-col.vue
@@ -8,7 +8,12 @@
       </t-radio-group>
     </div>
 
-    <div><t-checkbox v-model="fixedTopAndBottomRows">是否冻结首尾两行</t-checkbox></div>
+    <div>
+      <t-checkbox v-model="fixedTopAndBottomRows">是否冻结首尾两行</t-checkbox>
+      <t-checkbox v-model="stripe">是否显示斑马纹</t-checkbox>
+      <!-- TODO：虚拟滚动开启与关闭支持动态响应 -->
+      <!-- <t-checkbox v-model="virtualScroll">开启虚拟滚动</t-checkbox> -->
+    </div>
 
     <!-- 如果希望表格列宽自适应，设置 `table-layout: auto` 即可。需同时设置 table-content-width -->
     <!-- fixedRows: [2, 2] 表示冻结表格的头两行和尾两行 -->
@@ -22,7 +27,10 @@
       :table-content-width="tableLayout === 'fixed' ? undefined : '1600px'"
       :max-height="fixedTopAndBottomRows ? 500 : 300"
       :fixedRows="fixedTopAndBottomRows ? [2, 2] : undefined"
+      :scroll="virtualScroll ? { type: 'virtual' } : undefined"
+      :stripe="stripe"
       bordered
+      allowResizeColumnWidth
     >
       <template #operation="slotProps">
         <a class="link" @click="rehandleClickOp(slotProps)">删除</a>
@@ -31,27 +39,33 @@
   </div>
 </template>
 <script>
-const data = [];
-for (let i = 0; i < 20; i++) {
-  data.push({
-    index: i,
-    platform: i % 2 === 0 ? '共有' : '私有',
-    type: ['String', 'Number', 'Array', 'Object'][i % 4],
-    default: ['-', '0', '[]', '{}'][i % 4],
-    detail: {
-      position: `读取 ${i} 个数据的嵌套信息值`,
-      position1: `读取 ${i} 个数据的嵌套信息值`,
-    },
-    description: '数据源',
-    needed: i % 4 === 0 ? '是' : '否',
-  });
+function getData(count) {
+  const data = [];
+  for (let i = 0; i < count; i++) {
+    data.push({
+      index: i,
+      platform: i % 2 === 0 ? '共有' : '私有',
+      type: ['String', 'Number', 'Array', 'Object'][i % 4],
+      default: ['-', '0', '[]', '{}'][i % 4],
+      detail: {
+        position: `读取 ${i} 个数据的嵌套信息值`,
+        position1: `读取 ${i} 个数据的嵌套信息值`,
+      },
+      description: '数据源',
+      needed: i % 4 === 0 ? '是' : '否',
+    });
+  }
+  return data;
 }
+
 export default {
   data() {
     return {
+      virtualScroll: false,
       fixedTopAndBottomRows: false,
+      stripe: false,
       tableLayout: 'fixed',
-      data,
+      data: getData(14),
       columns: [
         {
           align: 'center',
@@ -107,6 +121,11 @@ export default {
       ],
     };
   },
+  watch: {
+    virtualScroll(val) {
+      this.data = val ? getData(2000) : getData(15);
+    },
+  },
   methods: {
     rehandleClickOp({ text, row }) {
       console.log(text, row);
diff --git a/examples/table/demos/multi-header.vue b/examples/table/demos/multi-header.vue
index 1c6018274..ec9d3acd9 100644
--- a/examples/table/demos/multi-header.vue
+++ b/examples/table/demos/multi-header.vue
@@ -15,7 +15,7 @@
 
     <!-- tableContentWidth 必须大于表格的外层宽度，否则请设置 width: 100% -->
     <!-- 多级表头中，如果要使用固定列功能，则必须设置 colKey 和 fixed -->
-    <!-- :scroll="{ type: 'virtual' }" -->
+    <!-- :scroll="{ type: 'virtual' }" 表示虚拟滚动 -->
     <t-table
       row-key="index"
       :data="data"
diff --git a/examples/table/table.md b/examples/table/table.md
index c0d10820f..105ca0bf7 100644
--- a/examples/table/table.md
+++ b/examples/table/table.md
@@ -5,6 +5,7 @@
 
 名称 | 类型 | 默认值 | 说明 | 必传
 -- | -- | -- | -- | --
+allowResizeColumnWidth | Boolean | false | 是否允许调整列宽 | N
 bordered | Boolean | false | 是否显示表格边框 | N
 bottomContent | String / Slot / Function | - | 表格底部内容，可以用于自定义列设置等。TS 类型：`string | TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 columns | Array | [] | 列配置，泛型 T 指表格数据类型。TS 类型：`Array<BaseTableCol<T>>` | N
@@ -14,6 +15,8 @@ empty | String / Slot / Function | '' | 空表格呈现样式，支持全局配
 firstFullRow | String / Slot / Function | - | 首行内容。TS 类型：`string | TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 fixedRows | Array | - | 固定行（冻结行），示例：[M, N]，表示冻结表头 M 行和表尾 N 行。M 和 N 值为 0 时，表示不冻结行。TS 类型：`Array<number>` | N
 footData | Array | [] | 表尾数据源，泛型 T 指表格数据类型。TS 类型：`Array<T>` | N
+footerAffixedBottom | Boolean | false | 表尾吸底 | N
+footerAffixProps | Object | - | 表尾吸底基于 Affix 组件开发，透传全部 Affix 组件属性。TS 类型：`AffixProps` | N
 headerAffixedTop | Boolean | false | 表头吸顶 | N
 headerAffixProps | Object | - | 表头吸顶基于 Affix 组件开发，透传全部 Affix 组件属性。TS 类型：`AffixProps`，[Affix API Documents](./affix?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/table/type.ts) | N
 height | String / Number | - | 表格高度，超出后会出现滚动条。示例：100,  '30%',  '300'。值为数字类型，会自动加上单位 px。如果不是绝对固定表格高度，建议使用 `maxHeight` | N
diff --git a/src/_common b/src/_common
index 9308914fb..ae17be88a 160000
--- a/src/_common
+++ b/src/_common
@@ -1 +1 @@
-Subproject commit 9308914fb9bfae7f483a5e24a25e7ac7f59715a8
+Subproject commit ae17be88ab9398fcdbfde8e54f055d2856e2d294
diff --git a/src/table/README.md b/src/table/README.md
index 55211d937..9bcbfac89 100644
--- a/src/table/README.md
+++ b/src/table/README.md
@@ -17,7 +17,7 @@
 - hooks/useColumnController 自定义列配置，PrimaryTable
 - hooks/useColumnResize 列宽可拖动，BaseTable
 - hooks/useFilter 过滤/筛选，PrimaryTable
-- hooks/useFixed 固定表头/固定列/固定行，BaseTable
+- hooks/useFixed 固定表头/固定列/固定行，表头吸顶，表尾吸顶，BaseTable
 - hooks/useMultiHeader 多级表头，BaseTable
 - hooks/usePagination 分页，BaseTable
 - hooks/useRowExpand 展开/收起行，PrimaryTable
diff --git a/src/table/base-table-props.ts b/src/table/base-table-props.ts
index 8274565aa..4b0f4d9a6 100644
--- a/src/table/base-table-props.ts
+++ b/src/table/base-table-props.ts
@@ -8,6 +8,8 @@ import { TdBaseTableProps } from '../table/type';
 import { PropType } from 'vue';
 
 export default {
+  /** 是否允许调整列宽 */
+  allowResizeColumnWidth: Boolean,
   /** 是否显示表格边框 */
   bordered: Boolean,
   /** 表格底部内容，可以用于自定义列设置等 */
@@ -44,6 +46,12 @@ export default {
     type: Array as PropType<TdBaseTableProps['footData']>,
     default: (): TdBaseTableProps['footData'] => [],
   },
+  /** 表尾吸底 */
+  footerAffixedBottom: Boolean,
+  /** 表尾吸底基于 Affix 组件开发，透传全部 Affix 组件属性 */
+  footerAffixProps: {
+    type: Object as PropType<TdBaseTableProps['footerAffixProps']>,
+  },
   /** 表头吸顶 */
   headerAffixedTop: Boolean,
   /** 表头吸顶基于 Affix 组件开发，透传全部 Affix 组件属性 */
@@ -73,7 +81,7 @@ export default {
   maxHeight: {
     type: [String, Number] as PropType<TdBaseTableProps['maxHeight']>,
   },
-  /** 分页配置，值为空则不显示。具体 API 参考分页组件。当 `data` 数据长度超过分页大小时，会自动对本地数据 `data` 进行排序，如果不希望对于 `data` 进行排序，可以设置 `disableDataPage = true`。 */
+  /** 分页配置，值为空则不显示。具体 API 参考分页组件。当 `data` 数据长度超过分页大小时，会自动对本地数据 `data` 进行排序，如果不希望对于 `data` 进行排序，可以设置 `disableDataPage = true` */
   pagination: {
     type: Object as PropType<TdBaseTableProps['pagination']>,
   },
diff --git a/src/table/base-table.tsx b/src/table/base-table.tsx
index 288ebd554..053571539 100644
--- a/src/table/base-table.tsx
+++ b/src/table/base-table.tsx
@@ -7,6 +7,8 @@ import {
   provide,
   nextTick,
   PropType,
+  watch,
+  onMounted,
 } from '@vue/composition-api';
 import pick from 'lodash/pick';
 import props from './base-table-props';
@@ -46,6 +48,7 @@ export default defineComponent({
     const renderTNode = useTNodeJSX();
     const tableRef = ref<HTMLDivElement>();
     const tableElmRef = ref<HTMLTableElement>();
+    const tableFootHeight = ref(0);
     const {
       virtualScrollClasses, tableLayoutClasses, tableBaseClass, tableColFixedClasses,
     } = useClassName();
@@ -55,9 +58,11 @@ export default defineComponent({
     // 固定表头和固定列逻辑
     const {
       affixHeaderRef,
+      affixFooterRef,
       scrollbarWidth,
       virtualScrollHeaderPos,
       tableWidth,
+      tableElmWidth,
       tableContentRef,
       isFixedHeader,
       isWidthOverflow,
@@ -65,16 +70,17 @@ export default defineComponent({
       thWidthList,
       showColumnShadow,
       showAffixHeader,
+      showAffixFooter,
       rowAndColFixedPosition,
       refreshTable,
-      onTableContentScroll,
       updateHeaderScroll,
+      setUseFixedTableElmRef,
     } = useFixed(props, context);
     const { isMultipleHeader, spansAndLeafNodes, thList } = useTableHeader(props);
     const { dataSource, isPaginateData, renderPagination } = usePagination(props, context);
 
     // 列宽拖拽逻辑
-    const columnResizeParams = useColumnResize(tableElmRef);
+    const columnResizeParams = useColumnResize(tableElmRef, refreshTable);
     const { resizeLineRef, resizeLineStyle } = columnResizeParams;
 
     const dynamicBaseTableClasses = computed(() => [
@@ -94,7 +100,9 @@ export default defineComponent({
       { [tableBaseClass.fullHeight]: props.height },
     ]);
 
-    const isVirtual = computed(() => type === 'virtual' && props.data?.length > (props.scroll?.threshold || 100));
+    const isVirtual = computed(
+      () => props.scroll?.type === 'virtual' && props.data?.length > (props.scroll?.threshold || 100),
+    );
 
     const showRightDivider = computed(
       () => props.bordered
@@ -102,6 +110,10 @@ export default defineComponent({
         && ((isMultipleHeader.value && isWidthOverflow.value) || !isMultipleHeader.value),
     );
 
+    watch(tableElmRef, () => {
+      setUseFixedTableElmRef(tableElmRef.value);
+    });
+
     const onFixedChange = () => {
       nextTick(() => {
         updateHeaderScroll();
@@ -119,6 +131,7 @@ export default defineComponent({
       return listener;
     };
 
+    // TODO: 这种直接解析 props 的方式，是非响应式的，无法动态设置虚拟滚动，不可如此使用。待改正
     const {
       type, rowHeight, bufferSize = 20, isFixedRowHeight = false,
     } = props.scroll || {};
@@ -144,27 +157,36 @@ export default defineComponent({
     provide('rowHeightRef', ref(rowHeight));
 
     let lastScrollY = -1;
-    const onInnerScroll = type === 'virtual'
-      ? (e: WheelEvent) => {
-        onTableContentScroll(e);
-        const target = (e.target || e.srcElement) as HTMLElement;
-        const top = target.scrollTop;
-        // 排除横向滚动出发的纵向虚拟滚动计算
-        if (Math.abs(lastScrollY - top) > 5) {
-          handleVirtualScroll();
-          lastScrollY = top;
-        } else {
-          lastScrollY = -1;
-        }
+    const onInnerVirtualScroll = (e: WheelEvent) => {
+      const target = (e.target || e.srcElement) as HTMLElement;
+      const top = target.scrollTop;
+      // 排除横向滚动出发的纵向虚拟滚动计算
+      if (Math.abs(lastScrollY - top) > 5) {
+        handleVirtualScroll();
+        lastScrollY = top;
+      } else {
+        lastScrollY = -1;
       }
-      : onTableContentScroll;
+    };
+
+    // used for top margin
+    const getTFootHeight = () => {
+      if (!tableElmRef.value) return;
+      tableFootHeight.value = tableElmRef.value.querySelector('tfoot')?.offsetHeight;
+    };
+
+    onMounted(() => {
+      getTFootHeight();
+    });
 
     return {
       thList,
       isVirtual,
       global,
+      tableFootHeight,
       virtualScrollHeaderPos,
       tableWidth,
+      tableElmWidth,
       tableRef,
       tableElmRef,
       tableBaseClass,
@@ -192,22 +214,23 @@ export default defineComponent({
       visibleData,
       translateY,
       affixHeaderRef,
+      affixFooterRef,
       showAffixHeader,
+      showAffixFooter,
       scrollbarWidth,
       isMultipleHeader,
       showRightDivider,
+      resizeLineRef,
+      resizeLineStyle,
+      columnResizeParams,
       getListener,
-      onTableContentScroll,
       renderPagination,
       renderTNode,
       handleRowMounted,
       onFixedChange,
       updateHeaderScroll,
-      onInnerScroll,
       refreshTable,
-      resizeLineRef,
-      resizeLineStyle,
-      columnResizeParams,
+      onInnerVirtualScroll,
     };
   },
 
@@ -229,7 +252,7 @@ export default defineComponent({
         style={{ width: `${this.tableWidth}px`, opacity: Number(this.showAffixHeader) }}
         class={{ [this.tableBaseClass.affixedHeaderElm]: this.headerAffixedTop || this.isVirtual }}
       >
-        <table class={this.tableElmClasses} style={{ ...this.tableElementStyles, width: `${this.tableWidth}px` }}>
+        <table class={this.tableElmClasses} style={{ ...this.tableElementStyles, width: `${this.tableElmWidth}px` }}>
           {colgroup}
           <THead
             scopedSlots={this.$scopedSlots}
@@ -240,12 +263,49 @@ export default defineComponent({
             spansAndLeafNodes={this.spansAndLeafNodes}
             thList={this.thList}
             thWidthList={this.thWidthList}
+            allowResizeColumnWidth={this.allowResizeColumnWidth}
             columnResizeParams={this.columnResizeParams}
           />
         </table>
       </div>
     );
 
+    let marginScrollbarWidth = this.isWidthOverflow ? this.scrollbarWidth : 0;
+    if (this.bordered) {
+      marginScrollbarWidth += 1;
+    }
+    // Hack: Affix 组件，marginTop 临时使用 负 margin 定位位置
+    const affixedFooter = Boolean(this.footerAffixedBottom && this.footData?.length && this.tableWidth) && (
+      <Affix
+        class={this.tableBaseClass.affixedFooterWrap}
+        props={this.footerAffixProps}
+        onFixedChange={this.onFixedChange}
+        offsetBottom={marginScrollbarWidth || 0}
+        style={{ marginTop: `${-1 * (this.tableFootHeight + marginScrollbarWidth)}px` }}
+      >
+        <div
+          ref="affixFooterRef"
+          style={{ width: `${this.tableWidth}px`, opacity: Number(this.showAffixFooter) }}
+          class={['scrollbar', { [this.tableBaseClass.affixedFooterElm]: this.footerAffixedBottom || this.isVirtual }]}
+        >
+          <table class={this.tableElmClasses} style={{ ...this.tableElementStyles, width: `${this.tableElmWidth}px` }}>
+            {colgroup}
+            <TFoot
+              rowKey={this.rowKey}
+              scopedSlots={this.$scopedSlots}
+              isFixedHeader={this.isFixedHeader}
+              rowAndColFixedPosition={rowAndColFixedPosition}
+              footData={this.footData}
+              columns={this.columns}
+              rowAttributes={this.rowAttributes}
+              rowClassName={this.rowClassName}
+              thWidthList={this.thWidthList}
+            ></TFoot>
+          </table>
+        </div>
+      </Affix>
+    );
+
     const translate = `translate(0, ${this.scrollHeight}px)`;
     const virtualStyle = {
       transform: translate,
@@ -276,12 +336,13 @@ export default defineComponent({
     };
     // Vue3 do not need getListener
     const on = this.getListener();
+    const scrollListener = this.isVirtual ? { scroll: this.onInnerVirtualScroll } : {};
     const tableContent = (
       <div
         ref="tableContentRef"
         class={this.tableBaseClass.content}
         style={this.tableContentStyles}
-        onScroll={this.onInnerScroll}
+        on={scrollListener}
       >
         <div ref="resizeLineRef" class={this.tableBaseClass.resizeLine} style={this.resizeLineStyle}></div>
         {this.isVirtual && <div class={this.virtualScrollClasses.cursor} style={virtualStyle} />}
@@ -295,6 +356,7 @@ export default defineComponent({
             bordered={this.bordered}
             spansAndLeafNodes={this.spansAndLeafNodes}
             thList={this.thList}
+            allowResizeColumnWidth={this.allowResizeColumnWidth}
             columnResizeParams={this.columnResizeParams}
           />
           <TBody scopedSlots={this.$scopedSlots} props={tableBodyProps} on={on} />
@@ -345,6 +407,8 @@ export default defineComponent({
 
         {loadingContent}
 
+        {affixedFooter}
+
         {this.showRightDivider && (
           <div
             class={this.tableBaseClass.scrollbarDivider}
@@ -354,7 +418,6 @@ export default defineComponent({
 
         {bottom}
         {pagination}
-        {/* {this.bordered ? [pagination, bottom] : [bottom, pagination]} */}
       </div>
     );
   },
diff --git a/src/table/hooks/useClassName.ts b/src/table/hooks/useClassName.ts
index 9f317167b..ae0205416 100644
--- a/src/table/hooks/useClassName.ts
+++ b/src/table/hooks/useClassName.ts
@@ -25,6 +25,8 @@ export default function useClassName() {
       multipleHeader: `${classPrefix.value}-table--multiple-header`,
       affixedHeader: `${classPrefix.value}-table--affixed-header`,
       affixedHeaderElm: `${classPrefix.value}-table__affixed-header-elm`,
+      affixedFooterElm: `${classPrefix.value}-table__affixed-footer-elm`,
+      affixedFooterWrap: `${classPrefix.value}-table__affixed-footer-wrap`,
       // 边框模式，固定表头，横向滚动时，右侧添加边线，分隔滚动条
       scrollbarDivider: `${classPrefix.value}-table__scroll-bar-divider`,
       // 当用户设置 height 为固定高度，为保证行元素铺满 table，则需设置 table 元素高度为 100%
diff --git a/src/table/hooks/useColumnResize.tsx b/src/table/hooks/useColumnResize.tsx
index f0a29d30a..d45f72789 100644
--- a/src/table/hooks/useColumnResize.tsx
+++ b/src/table/hooks/useColumnResize.tsx
@@ -1,7 +1,7 @@
-import { ref, reactive } from '@vue/composition-api';
+import { ref, Ref, reactive } from '@vue/composition-api';
 import { TableColumns } from './useMultiHeader';
 
-export default function useColumnResize(tableElmRef: any) {
+export default function useColumnResize(tableElmRef: Ref<HTMLTableElement>, refreshTable: () => void) {
   const resizeLineRef = ref<HTMLDivElement>();
 
   const resizeLineParams = {
@@ -53,14 +53,14 @@ export default function useColumnResize(tableElmRef: any) {
     resizeLineParams.isDragging = true;
     resizeLineParams.draggingStart = e.x;
 
-    // 初始化resizeline标记线
+    // 初始化 resizeLine 标记线
     if (resizeLineRef?.value) {
       resizeLineStyle.display = 'block';
       resizeLineStyle.left = `${resizeLinePos}px`;
       resizeLineStyle.height = `${tableElmRef.value?.clientHeight}px`;
     }
 
-    // 拖拽时鼠标可能会超出table范围，需要给docuemnt绑定拖拽相关事件
+    // 拖拽时鼠标可能会超出 table 范围，需要给 document 绑定拖拽相关事件
     const onDragEnd = () => {
       if (resizeLineParams.isDragging) {
         // 结束拖拽，更新列宽
@@ -80,6 +80,8 @@ export default function useColumnResize(tableElmRef: any) {
         document.onselectstart = null;
         document.ondragstart = null;
       }
+
+      refreshTable();
     };
 
     const onDragOver = (e: MouseEvent) => {
diff --git a/src/table/hooks/useDragSort.ts b/src/table/hooks/useDragSort.ts
index 9d04472a7..a3dd5ca35 100644
--- a/src/table/hooks/useDragSort.ts
+++ b/src/table/hooks/useDragSort.ts
@@ -37,10 +37,6 @@ export default function useDragSort(props: TdPrimaryTableProps, context: SetupCo
   // 列拖拽排序，存储上一次的变化结果
   const lastColList = ref([]);
 
-  if (dragSort.value === 'col') {
-    log.error('Table', "dragSort='col' is going to be used as column drag, please use dragSort='row-handler' instead.");
-  }
-
   if (dragSort.value === 'drag-col') {
     log.error('Table', "dragSort='drag-col' is going to be deprecated, please use dragSort='col' instead.");
   }
diff --git a/src/table/hooks/useFixed.ts b/src/table/hooks/useFixed.ts
index c1f6c032a..2e079069c 100644
--- a/src/table/hooks/useFixed.ts
+++ b/src/table/hooks/useFixed.ts
@@ -1,5 +1,5 @@
 import {
-  ref, reactive, watch, toRefs, SetupContext, onMounted, onUnmounted, computed,
+  ref, reactive, watch, toRefs, SetupContext, onMounted, computed, onBeforeMount,
 } from '@vue/composition-api';
 import get from 'lodash/get';
 import log from '../../_common/js/log';
@@ -115,14 +115,19 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
     lastFullRow,
     maxHeight,
     headerAffixedTop,
+    footerAffixedBottom,
     bordered,
   } = toRefs(props);
   const tableContentRef = ref<HTMLDivElement>();
   const isFixedHeader = ref(false);
   const isWidthOverflow = ref(false);
   const affixHeaderRef = ref<HTMLDivElement>();
+  const affixFooterRef = ref<HTMLDivElement>();
+  const tableElmRef = ref<HTMLTableElement>();
   // 当表格完全滚动消失在视野时，需要隐藏吸顶表头
   const showAffixHeader = ref(true);
+  // 当表格完全滚动消失在视野时，需要隐藏吸底尾部
+  const showAffixFooter = ref(true);
   // CSS 样式设置了固定 6px
   const scrollbarWidth = ref(6);
   // 固定列、固定表头、固定表尾等内容的位置信息
@@ -134,13 +139,21 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
   // 虚拟滚动不能使用 CSS sticky 固定表头
   const virtualScrollHeaderPos = ref<{ left: number; top: number }>({ left: 0, top: 0 });
   const tableWidth = ref(0);
+  const tableElmWidth = ref(0);
   const thWidthList = ref<{ [colKey: string]: number }>({});
 
   const isFixedColumn = ref(false);
   const isFixedRightColumn = ref(false);
+  const isFixedLeftColumn = ref(false);
 
   // 没有表头吸顶，没有虚拟滚动，则不需要表头宽度计算
-  const notNeedThWidthList = computed(() => !(props.headerAffixedTop || props.scroll?.type === 'virtual'));
+  const notNeedThWidthList = computed(
+    () => !(props.headerAffixedTop || props.footerAffixedBottom || props.scroll?.type === 'virtual'),
+  );
+
+  function setUseFixedTableElmRef(val: HTMLTableElement) {
+    tableElmRef.value = val;
+  }
 
   function getColumnMap(
     columns: BaseTableCol[],
@@ -157,6 +170,9 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
       if (col.fixed === 'right') {
         isFixedRightColumn.value = true;
       }
+      if (col.fixed === 'left') {
+        isFixedLeftColumn.value = true;
+      }
       const key = col.colKey || i;
       const columnInfo: FixedColumnInfo = { col, parent, index: i };
       map.set(key, columnInfo);
@@ -306,6 +322,7 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
 
   let lastScrollLeft = -1;
   const updateHeaderScroll = (target?: HTMLElement) => {
+    if (notNeedThWidthList.value) return;
     if (!target) {
       lastScrollLeft = -1;
     }
@@ -315,19 +332,47 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
     const left = newTarget.scrollLeft;
     if (lastScrollLeft === left) return;
     if (affixHeaderRef.value) {
-      const left = newTarget.scrollLeft;
       lastScrollLeft = left;
       affixHeaderRef.value.scrollLeft = left;
     }
+    if (affixFooterRef.value) {
+      lastScrollLeft = left;
+      affixFooterRef.value.scrollLeft = left;
+    }
+  };
+
+  let lastFootScrollLeft = -1;
+  const updateScrollPositionByFootScrollbar = () => {
+    if (notNeedThWidthList.value) return;
+    const target = affixFooterRef.value;
+    const left = target.scrollLeft;
+    if (lastFootScrollLeft === left) return;
+    if (affixHeaderRef.value) {
+      lastFootScrollLeft = left;
+      affixHeaderRef.value.scrollLeft = left;
+    }
+    if (tableContentRef.value) {
+      lastFootScrollLeft = left;
+      tableContentRef.value.scrollLeft = left;
+    }
   };
 
   // 为保证版本兼容，临时保留 onScrollX 和 onScrollY
-  const onTableContentScroll = (e: WheelEvent) => {
-    const target = (e.target || e.srcElement) as HTMLElement;
+  const onTableContentScroll = (params?: { e: WheelEvent; trigger: 'tfoot' | 'tbody' }) => {
+    // const target = (e.target || e.srcElement) as HTMLElement;
+    const target = tableContentRef.value;
     // 阴影更新
     updateColumnFixedShadow(target);
-    // 表头滚动位置更新
-    updateHeaderScroll(target);
+    if (params?.trigger === 'tfoot') {
+      updateScrollPositionByFootScrollbar();
+    } else {
+      // 表头和表尾滚动位置更新
+      updateHeaderScroll(target);
+    }
+    onContentScrollEvent(params.e);
+  };
+
+  const onContentScrollEvent = (e: WheelEvent) => {
     props.onScrollX?.({ e });
     // Vue3 ignore next line
     context.emit('scroll-x', { e });
@@ -399,11 +444,12 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
   };
 
   const updateTableWidth = () => {
-    const rect = tableContentRef.value.getBoundingClientRect();
+    const rect = tableContentRef.value?.getBoundingClientRect();
     // 存在纵向滚动条，且固定表头时，需去除滚动条宽度
     const reduceWidth = isFixedHeader.value ? scrollbarWidth.value : 0;
-    const fixedBordered = isFixedRightColumn.value ? 1 : 2;
-    tableWidth.value = rect.width - reduceWidth - (props.bordered ? fixedBordered : 0);
+    tableWidth.value = rect.width - reduceWidth - (props.bordered ? 1 : 0);
+    const elmRect = tableElmRef?.value?.getBoundingClientRect();
+    tableElmWidth.value = elmRect?.width;
   };
 
   const updateThWidthList = (trList: HTMLCollection) => {
@@ -417,11 +463,7 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
       }
     }
     thWidthList.value = widthMap;
-    if (affixHeaderRef.value) {
-      const left = tableContentRef.value.scrollLeft;
-      lastScrollLeft = left;
-      affixHeaderRef.value.scrollLeft = left;
-    }
+    updateHeaderScroll();
   };
 
   const updateThWidthListHandler = () => {
@@ -435,9 +477,16 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
   };
 
   const onDocumentScroll = () => {
+    if (notNeedThWidthList.value) return;
     const pos = tableContentRef.value.getBoundingClientRect();
-    const r = affixHeaderRef.value?.offsetHeight - pos.top < pos.height;
-    showAffixHeader.value = r;
+    if (props.headerAffixedTop || props.scroll?.type === 'virtual') {
+      const r = affixHeaderRef.value?.offsetHeight - pos.top < pos.height;
+      showAffixHeader.value = r;
+    }
+    if (props.footerAffixedBottom) {
+      showAffixFooter.value = pos.top + (affixFooterRef?.value?.clientHeight || 48) <= window.innerHeight
+        && -1 * pos.top < (tableContentRef?.value?.parentNode as HTMLDivElement)?.clientHeight;
+    }
   };
 
   watch(
@@ -464,13 +513,23 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
 
   // 影响表头宽度的元素
   watch(
-    [data, columns, bordered, tableLayout, fixedRows, isFixedHeader, headerAffixedTop, tableContentWidth],
+    [
+      data,
+      columns,
+      bordered,
+      tableLayout,
+      fixedRows,
+      isFixedHeader,
+      headerAffixedTop,
+      footerAffixedBottom,
+      tableContentWidth,
+    ],
     updateThWidthListHandler,
     { immediate: true },
   );
 
-  watch([headerAffixedTop], () => {
-    if (headerAffixedTop) {
+  watch([headerAffixedTop, footerAffixedBottom], ([headerAffixedTop, footerAffixedBottom]) => {
+    if (headerAffixedTop || footerAffixedBottom) {
       on(document, 'scroll', onDocumentScroll);
     } else {
       off(document, 'scroll', onDocumentScroll);
@@ -491,6 +550,52 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
 
   const onResize = refreshTable;
 
+  const onFootScroll = (e: WheelEvent) => {
+    onTableContentScroll({ e, trigger: 'tfoot' });
+  };
+
+  const onFootMouseEnter = () => {
+    on(affixFooterRef.value, 'scroll', onFootScroll);
+  };
+
+  const onFootMouseLeave = () => {
+    off(affixFooterRef.value, 'scroll', onFootScroll);
+  };
+
+  watch(affixFooterRef, () => {
+    if (footerAffixedBottom.value && affixFooterRef.value) {
+      on(affixFooterRef.value, 'mouseenter', onFootMouseEnter);
+      on(affixFooterRef.value, 'mouseleave', onFootMouseLeave);
+    } else {
+      off(affixFooterRef.value, 'mouseenter', onFootMouseEnter);
+      off(affixFooterRef.value, 'mouseleave', onFootMouseLeave);
+    }
+  });
+
+  const onTableContentMouseEnter = () => {
+    on(tableContentRef.value, 'scroll', onTableContentScroll);
+  };
+
+  const onTableContentMouseLeave = () => {
+    off(tableContentRef.value, 'scroll', onTableContentScroll);
+  };
+
+  const addTableContentListener = () => {
+    // 只有吸顶/吸底/虚拟滚动等场景需要滚动事件监听，同步多个 table 元素的滚动距离
+    if (notNeedThWidthList.value || !tableContentRef.value) return;
+    on(tableContentRef.value, 'mouseenter', onTableContentMouseEnter);
+    on(tableContentRef.value, 'mouseleave', onTableContentMouseLeave);
+  };
+
+  const removeTableContentListener = () => {
+    off(tableContentRef.value, 'mouseenter', onTableContentMouseEnter);
+    off(tableContentRef.value, 'mouseleave', onTableContentMouseLeave);
+  };
+
+  watch(tableContentRef, () => {
+    addTableContentListener();
+  });
+
   onMounted(() => {
     const scrollWidth = getScrollbarWidth();
     scrollbarWidth.value = scrollWidth;
@@ -498,36 +603,51 @@ export default function useFixed(props: TdBaseTableProps, context: SetupContext)
       updateTableWidth();
       clearTimeout(timer);
     });
+    if (headerAffixedTop.value || footerAffixedBottom.value) {
+      on(document, 'scroll', onDocumentScroll);
+    } else {
+      off(document, 'scroll', onDocumentScroll);
+    }
     if (isFixedColumn.value || isFixedHeader.value || !notNeedThWidthList.value) {
       on(window, 'resize', onResize);
     }
+    addTableContentListener();
   });
 
-  onUnmounted(() => {
+  onBeforeMount(() => {
     if (isFixedColumn.value || isFixedHeader.value || !notNeedThWidthList.value) {
       off(window, 'resize', onResize);
     }
-    if (props.headerAffixedTop) {
+    if (props.headerAffixedTop || props.footerAffixedBottom) {
       off(document, 'scroll', onDocumentScroll);
+      off(affixFooterRef.value, 'mouseenter', onFootMouseEnter);
+      off(affixFooterRef.value, 'mouseleave', onFootMouseLeave);
+    }
+    if (!notNeedThWidthList.value) {
+      removeTableContentListener();
     }
   });
 
   return {
     tableWidth,
+    tableElmWidth,
     thWidthList,
     isFixedHeader,
     isWidthOverflow,
     tableContentRef,
     showAffixHeader,
+    showAffixFooter,
     isFixedColumn,
     showColumnShadow,
     rowAndColFixedPosition,
     virtualScrollHeaderPos,
     affixHeaderRef,
+    affixFooterRef,
     scrollbarWidth,
     refreshTable,
     updateThWidthListHandler,
     updateHeaderScroll,
     onTableContentScroll,
+    setUseFixedTableElmRef,
   };
 }
diff --git a/src/table/primary-table-props.ts b/src/table/primary-table-props.ts
index 9f566a5cb..8df4bf2dc 100644
--- a/src/table/primary-table-props.ts
+++ b/src/table/primary-table-props.ts
@@ -40,7 +40,7 @@ export default {
   defaultDisplayColumns: {
     type: Array as PropType<TdPrimaryTableProps['defaultDisplayColumns']>,
   },
-  /** 拖拽排序方式，值为 `row` 表示行拖拽排序，这种方式无法进行文本复制，慎用。值为`row-handler` 表示通过专门的 拖拽手柄 进行 行拖拽排序。值为 `col` 表示列顺序拖拽，列拖拽功能开发中。`drag-col` 已废弃，请勿使用。 */
+  /** 拖拽排序方式，值为 `row` 表示行拖拽排序，这种方式无法进行文本复制，慎用。值为`row-handler` 表示通过专门的 拖拽手柄 进行 行拖拽排序。值为 `col` 表示列顺序拖拽，列拖拽功能开发中。`drag-col` 已废弃，请勿使用 */
   dragSort: {
     type: String as PropType<TdPrimaryTableProps['dragSort']>,
     validator(val: TdPrimaryTableProps['dragSort']): boolean {
diff --git a/src/table/tfoot.tsx b/src/table/tfoot.tsx
index d56d24eab..dbd0f0df8 100644
--- a/src/table/tfoot.tsx
+++ b/src/table/tfoot.tsx
@@ -8,6 +8,7 @@ import { BaseTableCellParams, TableRowData, TdBaseTableProps } from './type';
 import { formatRowAttributes, formatRowClassNames } from './utils';
 import { getColumnFixedStyles, RowAndColFixedPosition } from './hooks/useFixed';
 import useClassName from './hooks/useClassName';
+import { Styles } from '../common';
 
 export interface TFootProps {
   rowKey: string;
@@ -19,6 +20,8 @@ export interface TFootProps {
   columns: TdBaseTableProps['columns'];
   rowAttributes: TdBaseTableProps['rowAttributes'];
   rowClassName: TdBaseTableProps['rowClassName'];
+  // 表尾吸底内容宽度
+  thWidthList?: { [colKey: string]: number };
 }
 
 export default defineComponent({
@@ -32,6 +35,7 @@ export default defineComponent({
     columns: Array as PropType<TFootProps['columns']>,
     rowAttributes: [Array, Object, Function] as PropType<TFootProps['rowAttributes']>,
     rowClassName: [Array, String, Object, Function] as PropType<TFootProps['rowClassName']>,
+    thWidthList: [Object] as PropType<TFootProps['thWidthList']>,
   },
 
   // eslint-disable-next-line
@@ -58,7 +62,7 @@ export default defineComponent({
     if (!this.footData || !this.footData.length || !this.columns) return null;
     const theadClasses = [this.tableFooterClasses.footer, { [this.tableFooterClasses.fixed]: this.isFixedHeader }];
     return (
-      <tfoot ref="tfooterRef" class={theadClasses}>
+      <tfoot ref="tFooterRef" class={theadClasses}>
         {this.footData.map((row, rowIndex) => {
           const trAttributes = formatRowAttributes(this.rowAttributes, { row, rowIndex, type: 'foot' });
           // 自定义行类名
@@ -76,8 +80,12 @@ export default defineComponent({
                   this.rowAndColFixedPosition,
                   this.tableColFixedClasses,
                 );
+                const style: Styles = { ...tdStyles.style };
+                if (this.thWidthList?.[col.colKey]) {
+                  style.width = `${this.thWidthList[col.colKey]}px`;
+                }
                 return (
-                  <td key={col.colKey} class={tdStyles.classes} style={tdStyles.style}>
+                  <td key={col.colKey} class={tdStyles.classes} style={style}>
                     {this.renderTFootCell({
                       row,
                       rowIndex,
diff --git a/src/table/thead.tsx b/src/table/thead.tsx
index 8d9921b17..e2646c15b 100644
--- a/src/table/thead.tsx
+++ b/src/table/thead.tsx
@@ -31,6 +31,7 @@ export interface TheadProps {
     onColumnMouseover: Function;
     onColumnMousedown: Function;
   };
+  allowResizeColumnWidth: Boolean;
 }
 
 export default defineComponent({
@@ -42,6 +43,7 @@ export default defineComponent({
     thWidthList: Object as PropType<TheadProps['thWidthList']>,
     bordered: Boolean,
     isMultipleHeader: Boolean,
+    allowResizeColumnWidth: Boolean,
     spansAndLeafNodes: Object as PropType<TheadProps['spansAndLeafNodes']>,
     thList: Array as PropType<TheadProps['thList']>,
     columnResizeParams: Object as PropType<TheadProps['columnResizeParams']>,
@@ -113,6 +115,12 @@ export default defineComponent({
           const width = withoutChildren && thWidthList?.[col.colKey] ? `${thWidthList?.[col.colKey]}px` : undefined;
           const styles = { ...(thStyles.style || {}), width };
           const innerTh = renderTitle(h, this.slots, col, index);
+          const resizeColumnListener = this.allowResizeColumnWidth
+            ? {
+              mousedown: (e: MouseEvent) => this.onColumnMousedown(e, col),
+              mousemove: (e: MouseEvent) => this.onColumnMouseover(e),
+            }
+            : {};
           return (
             <th
               key={col.colKey}
@@ -120,8 +128,7 @@ export default defineComponent({
               class={thClasses}
               style={styles}
               attrs={{ ...rowspanAndColspan }}
-              onmousemove={(e: MouseEvent) => this.onColumnMouseover(e)}
-              onmousedown={(e: MouseEvent) => this.onColumnMousedown(e, col)}
+              on={resizeColumnListener}
             >
               <div class={this.tableBaseClass.thCellInner}>
                 {col.ellipsis ? (
diff --git a/src/table/type.ts b/src/table/type.ts
index 4fb0fd3a0..c35be574e 100644
--- a/src/table/type.ts
+++ b/src/table/type.ts
@@ -19,6 +19,11 @@ import { DialogProps } from '../dialog';
 import { TNode, OptionData, SizeEnum, ClassName, HTMLElementAttributes } from '../common';
 
 export interface TdBaseTableProps<T extends TableRowData = TableRowData> {
+  /**
+   * 是否允许调整列宽
+   * @default false
+   */
+  allowResizeColumnWidth?: boolean;
   /**
    * 是否显示表格边框
    * @default false
@@ -61,6 +66,15 @@ export interface TdBaseTableProps<T extends TableRowData = TableRowData> {
    * @default []
    */
   footData?: Array<T>;
+  /**
+   * 表尾吸底
+   * @default false
+   */
+  footerAffixedBottom?: boolean;
+  /**
+   * 表尾吸底基于 Affix 组件开发，透传全部 Affix 组件属性
+   */
+  footerAffixProps?: AffixProps;
   /**
    * 表头吸顶
    * @default false
@@ -97,7 +111,7 @@ export interface TdBaseTableProps<T extends TableRowData = TableRowData> {
    */
   maxHeight?: string | number;
   /**
-   * 分页配置，值为空则不显示。具体 API 参考分页组件。当 `data` 数据长度超过分页大小时，会自动对本地数据 `data` 进行排序，如果不希望对于 `data` 进行排序，可以设置 `disableDataPage = true`。
+   * 分页配置，值为空则不显示。具体 API 参考分页组件。当 `data` 数据长度超过分页大小时，会自动对本地数据 `data` 进行排序，如果不希望对于 `data` 进行排序，可以设置 `disableDataPage = true`
    */
   pagination?: PaginationProps;
   /**
@@ -289,7 +303,7 @@ export interface TdPrimaryTableProps<T extends TableRowData = TableRowData>
    */
   defaultDisplayColumns?: CheckboxGroupValue;
   /**
-   * 拖拽排序方式，值为 `row` 表示行拖拽排序，这种方式无法进行文本复制，慎用。值为`row-handler` 表示通过专门的 拖拽手柄 进行 行拖拽排序。值为 `col` 表示列顺序拖拽，列拖拽功能开发中。`drag-col` 已废弃，请勿使用。
+   * 拖拽排序方式，值为 `row` 表示行拖拽排序，这种方式无法进行文本复制，慎用。值为`row-handler` 表示通过专门的 拖拽手柄 进行 行拖拽排序。值为 `col` 表示列顺序拖拽，列拖拽功能开发中。`drag-col` 已废弃，请勿使用
    */
   dragSort?: 'row' | 'row-handler' | 'col' | 'drag-col';
   /**
diff --git a/test/ssr/__snapshots__/ssr.test.js.snap b/test/ssr/__snapshots__/ssr.test.js.snap
index 60aaf2b9e..99334b500 100644
--- a/test/ssr/__snapshots__/ssr.test.js.snap
+++ b/test/ssr/__snapshots__/ssr.test.js.snap
@@ -11987,6 +11987,198 @@ exports[`ssr snapshot test renders ./examples/switch/demos/status.vue correctly
 </div>
 `;
 
+exports[`ssr snapshot test renders ./examples/table/demos/affix.vue correctly 1`] = `
+<div class="tdesign-demo-block-column-large tdesign-demo__table-affix" style="width:100%;">
+  <div><label class="t-checkbox t-is-checked"><input type="checkbox" checked="checked" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">表头吸顶</span></label> <label class="t-checkbox t-is-checked" style="margin-left:32px;"><input type="checkbox" checked="checked" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">表尾吸底</span></label> <label class="t-checkbox t-is-checked" style="margin-left:32px;"><input type="checkbox" checked="checked" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">固定左侧列</span></label> <label class="t-checkbox t-is-checked" style="margin-left:32px;"><input type="checkbox" checked="checked" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">固定右侧列</span></label></div>
+  <div class="t-table t-table--bordered t-table--affixed-header t-table--column-fixed" style="position:relative;">
+    <div offsetTop="0"></div>
+    <div class="t-table__content">
+      <div class="t-table__resize-line" style="display:none;left:10px;height:10px;"></div>
+      <table class="t-table--layout-auto" style="width:;">
+        <colgroup>
+          <col>
+          <col>
+          <col>
+          <col>
+          <col>
+          <col>
+          <col>
+          <col>
+          <col>
+          <col style="width:80px;">
+        </colgroup>
+        <thead class="t-table__header">
+          <tr>
+            <th data-colkey="index" class="row t-table__th-index t-align-center">
+              <div class="t-table__th-cell-inner">序号</div>
+            </th>
+            <th data-colkey="platform" class="t-table__th-platform">
+              <div class="t-table__th-cell-inner">平台</div>
+            </th>
+            <th data-colkey="type" class="t-table__th-type">
+              <div class="t-table__th-cell-inner">类型</div>
+            </th>
+            <th data-colkey="expo" class="t-table__th-expo">
+              <div class="t-table__th-cell-inner">曝光</div>
+            </th>
+            <th data-colkey="click" class="t-table__th-click">
+              <div class="t-table__th-cell-inner">点击</div>
+            </th>
+            <th data-colkey="ctr" class="t-table__th-ctr">
+              <div class="t-table__th-cell-inner">点击率</div>
+            </th>
+            <th data-colkey="default" class="t-table__th-default">
+              <div class="t-table__th-cell-inner">默认值</div>
+            </th>
+            <th data-colkey="required" class="t-table__th-required">
+              <div class="t-table__th-cell-inner">是否必传</div>
+            </th>
+            <th data-colkey="detail.position" class="t-table__th-detail.position">
+              <div class="t-table__th-cell-inner">
+                <div class="t-table__ellipsis t-text-ellipsis">详情信息</div>
+              </div>
+            </th>
+            <th data-colkey="operation" class="t-table__th-operation">
+              <div class="t-table__th-cell-inner">操作</div>
+            </th>
+          </tr>
+        </thead>
+        <tbody class="t-table__body">
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">0</td>
+            <td>共有</td>
+            <td>String</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>是</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 0 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">1</td>
+            <td>私有</td>
+            <td>Number</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>0</td>
+            <td>否</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 1 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">2</td>
+            <td>共有</td>
+            <td>Array</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>[]</td>
+            <td>否</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 2 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">3</td>
+            <td>私有</td>
+            <td>Object</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>{}</td>
+            <td>否</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 3 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">4</td>
+            <td>共有</td>
+            <td>String</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>是</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 4 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">5</td>
+            <td>私有</td>
+            <td>Number</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>0</td>
+            <td>否</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 5 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">6</td>
+            <td>共有</td>
+            <td>Array</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>[]</td>
+            <td>否</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 6 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+          <tr class="t-tdesign__custom-body-tr">
+            <td class="row t-align-center">7</td>
+            <td>私有</td>
+            <td>Object</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td>{}</td>
+            <td>否</td>
+            <td class="t-table-td--ellipsis">
+              <div class="t-table__ellipsis t-text-ellipsis">读取 7 个数据的嵌套信息值</div>
+            </td>
+            <td>查看</td>
+          </tr>
+        </tbody>
+        <tfoot class="t-table__footer">
+          <tr class="t-tdesign__custom-footer-tr">
+            <td><b style="color:rgb(0, 82, 217);">表尾</b></td>
+            <td><span>第 1 行</span></td>
+            <td>全部类型</td>
+            <td>-</td>
+            <td>-</td>
+            <td>-</td>
+            <td><span>空</span></td>
+            <td> 插槽渲染表尾 </td>
+            <td>
+              <div>渲染函数输出表尾信息</div>
+            </td>
+            <td>-</td>
+          </tr>
+        </tfoot>
+      </table>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`ssr snapshot test renders ./examples/table/demos/async-loading.vue correctly 1`] = `
 <div class="tdesign-demo-block-column-large">
   <div>
@@ -13830,7 +14022,7 @@ exports[`ssr snapshot test renders ./examples/table/demos/fixed-header-col.vue c
       <div class="t-radio-group__bg-block" style="width:0px;left:0px;"></div>
     </div>
   </div>
-  <div><label class="t-checkbox"><input type="checkbox" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否冻结首尾两行</span></label></div>
+  <div><label class="t-checkbox"><input type="checkbox" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否冻结首尾两行</span></label> <label class="t-checkbox"><input type="checkbox" class="t-checkbox__former"><span class="t-checkbox__input"></span><span class="t-checkbox__label">是否显示斑马纹</span></label></div>
   <div class="t-table t-table--bordered t-table--column-fixed" style="position:relative;">
     <div class="t-table__content" style="max-height:300px;">
       <div class="t-table__resize-line" style="display:none;left:10px;height:10px;"></div>
@@ -14014,66 +14206,6 @@ exports[`ssr snapshot test renders ./examples/table/demos/fixed-header-col.vue c
             <td>否</td>
             <td><a class="link">删除</a></td>
           </tr>
-          <tr>
-            <td class="t-align-center">14</td>
-            <td>共有</td>
-            <td>Array</td>
-            <td>[]</td>
-            <td>读取 14 个数据的嵌套信息值</td>
-            <td>数据源</td>
-            <td>否</td>
-            <td><a class="link">删除</a></td>
-          </tr>
-          <tr>
-            <td class="t-align-center">15</td>
-            <td>私有</td>
-            <td>Object</td>
-            <td>{}</td>
-            <td>读取 15 个数据的嵌套信息值</td>
-            <td>数据源</td>
-            <td>否</td>
-            <td><a class="link">删除</a></td>
-          </tr>
-          <tr>
-            <td class="t-align-center">16</td>
-            <td>共有</td>
-            <td>String</td>
-            <td>-</td>
-            <td>读取 16 个数据的嵌套信息值</td>
-            <td>数据源</td>
-            <td>是</td>
-            <td><a class="link">删除</a></td>
-          </tr>
-          <tr>
-            <td class="t-align-center">17</td>
-            <td>私有</td>
-            <td>Number</td>
-            <td>0</td>
-            <td>读取 17 个数据的嵌套信息值</td>
-            <td>数据源</td>
-            <td>否</td>
-            <td><a class="link">删除</a></td>
-          </tr>
-          <tr>
-            <td class="t-align-center">18</td>
-            <td>共有</td>
-            <td>Array</td>
-            <td>[]</td>
-            <td>读取 18 个数据的嵌套信息值</td>
-            <td>数据源</td>
-            <td>否</td>
-            <td><a class="link">删除</a></td>
-          </tr>
-          <tr>
-            <td class="t-align-center">19</td>
-            <td>私有</td>
-            <td>Object</td>
-            <td>{}</td>
-            <td>读取 19 个数据的嵌套信息值</td>
-            <td>数据源</td>
-            <td>否</td>
-            <td><a class="link">删除</a></td>
-          </tr>
         </tbody>
         <tfoot class="t-table__footer">
           <tr>
diff --git a/test/unit/table/__snapshots__/demo.test.js.snap b/test/unit/table/__snapshots__/demo.test.js.snap
index 9dca1eacf..acd067d4c 100644
--- a/test/unit/table/__snapshots__/demo.test.js.snap
+++ b/test/unit/table/__snapshots__/demo.test.js.snap
@@ -1,5 +1,750 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Table Table affixVue demo works fine 1`] = `
+<div
+  class="tdesign-demo-block-column-large tdesign-demo__table-affix"
+  style="width: 100%;"
+>
+  <div>
+    <label
+      class="t-checkbox t-is-checked"
+    >
+      <input
+        class="t-checkbox__former"
+        type="checkbox"
+        value=""
+      />
+      <span
+        class="t-checkbox__input"
+      />
+      <span
+        class="t-checkbox__label"
+      >
+        表头吸顶
+      </span>
+    </label>
+     
+    <label
+      class="t-checkbox t-is-checked"
+      style="margin-left: 32px;"
+    >
+      <input
+        class="t-checkbox__former"
+        type="checkbox"
+        value=""
+      />
+      <span
+        class="t-checkbox__input"
+      />
+      <span
+        class="t-checkbox__label"
+      >
+        表尾吸底
+      </span>
+    </label>
+     
+    <label
+      class="t-checkbox t-is-checked"
+      style="margin-left: 32px;"
+    >
+      <input
+        class="t-checkbox__former"
+        type="checkbox"
+        value=""
+      />
+      <span
+        class="t-checkbox__input"
+      />
+      <span
+        class="t-checkbox__label"
+      >
+        固定左侧列
+      </span>
+    </label>
+     
+    <label
+      class="t-checkbox t-is-checked"
+      style="margin-left: 32px;"
+    >
+      <input
+        class="t-checkbox__former"
+        type="checkbox"
+        value=""
+      />
+      <span
+        class="t-checkbox__input"
+      />
+      <span
+        class="t-checkbox__label"
+      >
+        固定右侧列
+      </span>
+    </label>
+  </div>
+   
+  <div
+    class="t-table t-table--bordered t-table--affixed-header t-table--column-fixed"
+    style="position: relative;"
+  >
+    <div
+      offsettop="0"
+    />
+    <div
+      class="t-table__content"
+    >
+      <div
+        class="t-table__resize-line"
+        style="display: none; left: 10px; height: 10px;"
+      />
+      <table
+        class="t-table--layout-auto"
+      >
+        <colgroup>
+          <col />
+          <col />
+          <col />
+          <col />
+          <col />
+          <col />
+          <col />
+          <col />
+          <col />
+          <col
+            style="width: 80px;"
+          />
+        </colgroup>
+        <thead
+          class="t-table__header"
+        >
+          <tr>
+            <th
+              class="row t-table__th-index t-align-center"
+              data-colkey="index"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                序号
+              </div>
+            </th>
+            <th
+              class="t-table__th-platform"
+              data-colkey="platform"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                平台
+              </div>
+            </th>
+            <th
+              class="t-table__th-type"
+              data-colkey="type"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                类型
+              </div>
+            </th>
+            <th
+              class="t-table__th-expo"
+              data-colkey="expo"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                曝光
+              </div>
+            </th>
+            <th
+              class="t-table__th-click"
+              data-colkey="click"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                点击
+              </div>
+            </th>
+            <th
+              class="t-table__th-ctr"
+              data-colkey="ctr"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                点击率
+              </div>
+            </th>
+            <th
+              class="t-table__th-default"
+              data-colkey="default"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                默认值
+              </div>
+            </th>
+            <th
+              class="t-table__th-required"
+              data-colkey="required"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                是否必传
+              </div>
+            </th>
+            <th
+              class="t-table__th-detail.position"
+              data-colkey="detail.position"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                <div
+                  class="t-table__ellipsis t-text-ellipsis"
+                >
+                  详情信息
+                </div>
+              </div>
+            </th>
+            <th
+              class="t-table__th-operation"
+              data-colkey="operation"
+            >
+              <div
+                class="t-table__th-cell-inner"
+              >
+                操作
+              </div>
+            </th>
+          </tr>
+        </thead>
+        <tbody
+          class="t-table__body"
+        >
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              0
+            </td>
+            <td
+              class=""
+            >
+              共有
+            </td>
+            <td
+              class=""
+            >
+              String
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              是
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 0 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              1
+            </td>
+            <td
+              class=""
+            >
+              私有
+            </td>
+            <td
+              class=""
+            >
+              Number
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              0
+            </td>
+            <td
+              class=""
+            >
+              否
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 1 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              2
+            </td>
+            <td
+              class=""
+            >
+              共有
+            </td>
+            <td
+              class=""
+            >
+              Array
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              []
+            </td>
+            <td
+              class=""
+            >
+              否
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 2 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              3
+            </td>
+            <td
+              class=""
+            >
+              私有
+            </td>
+            <td
+              class=""
+            >
+              Object
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              {}
+            </td>
+            <td
+              class=""
+            >
+              否
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 3 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              4
+            </td>
+            <td
+              class=""
+            >
+              共有
+            </td>
+            <td
+              class=""
+            >
+              String
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              是
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 4 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              5
+            </td>
+            <td
+              class=""
+            >
+              私有
+            </td>
+            <td
+              class=""
+            >
+              Number
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              0
+            </td>
+            <td
+              class=""
+            >
+              否
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 5 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              6
+            </td>
+            <td
+              class=""
+            >
+              共有
+            </td>
+            <td
+              class=""
+            >
+              Array
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              []
+            </td>
+            <td
+              class=""
+            >
+              否
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 6 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+          <tr
+            class="t-tdesign__custom-body-tr"
+          >
+            <td
+              class="row t-align-center"
+            >
+              7
+            </td>
+            <td
+              class=""
+            >
+              私有
+            </td>
+            <td
+              class=""
+            >
+              Object
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              -
+            </td>
+            <td
+              class=""
+            >
+              {}
+            </td>
+            <td
+              class=""
+            >
+              否
+            </td>
+            <td
+              class="t-table-td--ellipsis"
+            >
+              <div
+                class="t-table__ellipsis t-text-ellipsis"
+              >
+                读取 7 个数据的嵌套信息值
+              </div>
+            </td>
+            <td
+              class=""
+            >
+              查看
+            </td>
+          </tr>
+        </tbody>
+        <tfoot
+          class="t-table__footer"
+        >
+          <tr
+            class="t-tdesign__custom-footer-tr"
+          >
+            <td>
+              <b
+                style="color: rgb(0, 82, 217);"
+              >
+                表尾
+              </b>
+            </td>
+            <td>
+              <span>
+                第 1 行
+              </span>
+            </td>
+            <td>
+              全部类型
+            </td>
+            <td>
+              -
+            </td>
+            <td>
+              -
+            </td>
+            <td>
+              -
+            </td>
+            <td>
+              <span>
+                空
+              </span>
+            </td>
+            <td>
+               插槽渲染表尾 
+            </td>
+            <td>
+              <div>
+                渲染函数输出表尾信息
+              </div>
+            </td>
+            <td>
+              -
+            </td>
+          </tr>
+        </tfoot>
+      </table>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`Table Table asyncLoadingVue demo works fine 1`] = `
 <div
   class="tdesign-demo-block-column-large"
@@ -5837,6 +6582,24 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
         是否冻结首尾两行
       </span>
     </label>
+     
+    <label
+      class="t-checkbox"
+    >
+      <input
+        class="t-checkbox__former"
+        type="checkbox"
+        value=""
+      />
+      <span
+        class="t-checkbox__input"
+      />
+      <span
+        class="t-checkbox__label"
+      >
+        是否显示斑马纹
+      </span>
+    </label>
   </div>
    
   <div
@@ -5888,286 +6651,94 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
               class="t-table__th-index t-align-center"
               data-colkey="index"
             >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                序号
-              </div>
-            </th>
-            <th
-              class="t-table__th-platform"
-              data-colkey="platform"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                平台
-              </div>
-            </th>
-            <th
-              class="t-table__th-type"
-              data-colkey="type"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                类型
-              </div>
-            </th>
-            <th
-              class="t-table__th-default"
-              data-colkey="default"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                默认值
-              </div>
-            </th>
-            <th
-              class="t-table__th-detail.position"
-              data-colkey="detail.position"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                详情信息
-              </div>
-            </th>
-            <th
-              class="t-table__th-description"
-              data-colkey="description"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                说明
-              </div>
-            </th>
-            <th
-              class="t-table__th-needed"
-              data-colkey="needed"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                必传
-              </div>
-            </th>
-            <th
-              class="t-table__th-operation"
-              data-colkey="operation"
-            >
-              <div
-                class="t-table__th-cell-inner"
-              >
-                操作
-              </div>
-            </th>
-          </tr>
-        </thead>
-        <tbody
-          class="t-table__body"
-        >
-          <tr
-            class=""
-          >
-            <td
-              class="t-align-center"
-            >
-              0
-            </td>
-            <td
-              class=""
-            >
-              共有
-            </td>
-            <td
-              class=""
-            >
-              String
-            </td>
-            <td
-              class=""
-            >
-              -
-            </td>
-            <td
-              class=""
-            >
-              读取 0 个数据的嵌套信息值
-            </td>
-            <td
-              class=""
-            >
-              数据源
-            </td>
-            <td
-              class=""
-            >
-              是
-            </td>
-            <td
-              class=""
-            >
-              <a
-                class="link"
-              >
-                删除
-              </a>
-            </td>
-          </tr>
-          <tr
-            class=""
-          >
-            <td
-              class="t-align-center"
-            >
-              1
-            </td>
-            <td
-              class=""
-            >
-              私有
-            </td>
-            <td
-              class=""
-            >
-              Number
-            </td>
-            <td
-              class=""
-            >
-              0
-            </td>
-            <td
-              class=""
-            >
-              读取 1 个数据的嵌套信息值
-            </td>
-            <td
-              class=""
-            >
-              数据源
-            </td>
-            <td
-              class=""
-            >
-              否
-            </td>
-            <td
-              class=""
-            >
-              <a
-                class="link"
-              >
-                删除
-              </a>
-            </td>
-          </tr>
-          <tr
-            class=""
-          >
-            <td
-              class="t-align-center"
-            >
-              2
-            </td>
-            <td
-              class=""
-            >
-              共有
-            </td>
-            <td
-              class=""
-            >
-              Array
-            </td>
-            <td
-              class=""
-            >
-              []
-            </td>
-            <td
-              class=""
-            >
-              读取 2 个数据的嵌套信息值
-            </td>
-            <td
-              class=""
-            >
-              数据源
-            </td>
-            <td
-              class=""
-            >
-              否
-            </td>
-            <td
-              class=""
-            >
-              <a
-                class="link"
+              <div
+                class="t-table__th-cell-inner"
               >
-                删除
-              </a>
-            </td>
-          </tr>
-          <tr
-            class=""
-          >
-            <td
-              class="t-align-center"
-            >
-              3
-            </td>
-            <td
-              class=""
+                序号
+              </div>
+            </th>
+            <th
+              class="t-table__th-platform"
+              data-colkey="platform"
             >
-              私有
-            </td>
-            <td
-              class=""
+              <div
+                class="t-table__th-cell-inner"
+              >
+                平台
+              </div>
+            </th>
+            <th
+              class="t-table__th-type"
+              data-colkey="type"
             >
-              Object
-            </td>
-            <td
-              class=""
+              <div
+                class="t-table__th-cell-inner"
+              >
+                类型
+              </div>
+            </th>
+            <th
+              class="t-table__th-default"
+              data-colkey="default"
             >
-              {}
-            </td>
-            <td
-              class=""
+              <div
+                class="t-table__th-cell-inner"
+              >
+                默认值
+              </div>
+            </th>
+            <th
+              class="t-table__th-detail.position"
+              data-colkey="detail.position"
             >
-              读取 3 个数据的嵌套信息值
-            </td>
-            <td
-              class=""
+              <div
+                class="t-table__th-cell-inner"
+              >
+                详情信息
+              </div>
+            </th>
+            <th
+              class="t-table__th-description"
+              data-colkey="description"
             >
-              数据源
-            </td>
-            <td
-              class=""
+              <div
+                class="t-table__th-cell-inner"
+              >
+                说明
+              </div>
+            </th>
+            <th
+              class="t-table__th-needed"
+              data-colkey="needed"
             >
-              否
-            </td>
-            <td
-              class=""
+              <div
+                class="t-table__th-cell-inner"
+              >
+                必传
+              </div>
+            </th>
+            <th
+              class="t-table__th-operation"
+              data-colkey="operation"
             >
-              <a
-                class="link"
+              <div
+                class="t-table__th-cell-inner"
               >
-                删除
-              </a>
-            </td>
+                操作
+              </div>
+            </th>
           </tr>
+        </thead>
+        <tbody
+          class="t-table__body"
+        >
           <tr
             class=""
           >
             <td
               class="t-align-center"
             >
-              4
+              0
             </td>
             <td
               class=""
@@ -6187,7 +6758,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 4 个数据的嵌套信息值
+              读取 0 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6215,7 +6786,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              5
+              1
             </td>
             <td
               class=""
@@ -6235,7 +6806,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 5 个数据的嵌套信息值
+              读取 1 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6263,7 +6834,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              6
+              2
             </td>
             <td
               class=""
@@ -6283,7 +6854,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 6 个数据的嵌套信息值
+              读取 2 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6311,7 +6882,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              7
+              3
             </td>
             <td
               class=""
@@ -6331,7 +6902,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 7 个数据的嵌套信息值
+              读取 3 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6359,7 +6930,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              8
+              4
             </td>
             <td
               class=""
@@ -6379,7 +6950,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 8 个数据的嵌套信息值
+              读取 4 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6407,7 +6978,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              9
+              5
             </td>
             <td
               class=""
@@ -6427,7 +6998,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 9 个数据的嵌套信息值
+              读取 5 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6455,7 +7026,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              10
+              6
             </td>
             <td
               class=""
@@ -6475,7 +7046,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 10 个数据的嵌套信息值
+              读取 6 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6503,7 +7074,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              11
+              7
             </td>
             <td
               class=""
@@ -6523,7 +7094,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 11 个数据的嵌套信息值
+              读取 7 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6551,7 +7122,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              12
+              8
             </td>
             <td
               class=""
@@ -6571,7 +7142,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 12 个数据的嵌套信息值
+              读取 8 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6599,7 +7170,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              13
+              9
             </td>
             <td
               class=""
@@ -6619,7 +7190,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 13 个数据的嵌套信息值
+              读取 9 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6647,7 +7218,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              14
+              10
             </td>
             <td
               class=""
@@ -6667,7 +7238,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 14 个数据的嵌套信息值
+              读取 10 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6695,7 +7266,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              15
+              11
             </td>
             <td
               class=""
@@ -6715,7 +7286,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 15 个数据的嵌套信息值
+              读取 11 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6743,7 +7314,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              16
+              12
             </td>
             <td
               class=""
@@ -6763,7 +7334,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 16 个数据的嵌套信息值
+              读取 12 个数据的嵌套信息值
             </td>
             <td
               class=""
@@ -6791,7 +7362,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class="t-align-center"
             >
-              17
+              13
             </td>
             <td
               class=""
@@ -6811,103 +7382,7 @@ exports[`Table Table fixedHeaderColVue demo works fine 1`] = `
             <td
               class=""
             >
-              读取 17 个数据的嵌套信息值
-            </td>
-            <td
-              class=""
-            >
-              数据源
-            </td>
-            <td
-              class=""
-            >
-              否
-            </td>
-            <td
-              class=""
-            >
-              <a
-                class="link"
-              >
-                删除
-              </a>
-            </td>
-          </tr>
-          <tr
-            class=""
-          >
-            <td
-              class="t-align-center"
-            >
-              18
-            </td>
-            <td
-              class=""
-            >
-              共有
-            </td>
-            <td
-              class=""
-            >
-              Array
-            </td>
-            <td
-              class=""
-            >
-              []
-            </td>
-            <td
-              class=""
-            >
-              读取 18 个数据的嵌套信息值
-            </td>
-            <td
-              class=""
-            >
-              数据源
-            </td>
-            <td
-              class=""
-            >
-              否
-            </td>
-            <td
-              class=""
-            >
-              <a
-                class="link"
-              >
-                删除
-              </a>
-            </td>
-          </tr>
-          <tr
-            class=""
-          >
-            <td
-              class="t-align-center"
-            >
-              19
-            </td>
-            <td
-              class=""
-            >
-              私有
-            </td>
-            <td
-              class=""
-            >
-              Object
-            </td>
-            <td
-              class=""
-            >
-              {}
-            </td>
-            <td
-              class=""
-            >
-              读取 19 个数据的嵌套信息值
+              读取 13 个数据的嵌套信息值
             </td>
             <td
               class=""
diff --git a/test/unit/table/demo.test.js b/test/unit/table/demo.test.js
index c43970430..0724728a4 100644
--- a/test/unit/table/demo.test.js
+++ b/test/unit/table/demo.test.js
@@ -5,6 +5,7 @@
 import { mount } from '@vue/test-utils';
 import MockDate from 'mockdate';
 
+import affixVue from '@/examples/table/demos/affix.vue';
 import asyncLoadingVue from '@/examples/table/demos/async-loading.vue';
 import baseVue from '@/examples/table/demos/base.vue';
 import customCellVue from '@/examples/table/demos/custom-cell.vue';
@@ -39,6 +40,7 @@ import treeVue from '@/examples/table/demos/tree.vue';
 MockDate.set('2020-12-28');
 
 const mapper = {
+  affixVue,
   asyncLoadingVue,
   baseVue,
   customCellVue,