diff --git a/src/packages/table/demos/h5/demo1.tsx b/src/packages/table/demos/h5/demo1.tsx
index 87cb402c15..00995125a5 100644
--- a/src/packages/table/demos/h5/demo1.tsx
+++ b/src/packages/table/demos/h5/demo1.tsx
@@ -12,11 +12,11 @@ interface TableColumnProps {
 }
 
 const Demo1 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: 'ID',
       key: 'id',
-      render: (record: any, index) => {
+      render: (_record: any, index) => {
         return index + 1
       },
     },
@@ -26,11 +26,11 @@ const Demo1 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -41,24 +41,24 @@ const Demo1 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} />
+  return <Table columns={columns} data={data} />
 }
 export default Demo1
diff --git a/src/packages/table/demos/h5/demo10.tsx b/src/packages/table/demos/h5/demo10.tsx
index 32c55d50b0..4f1e5421c6 100644
--- a/src/packages/table/demos/h5/demo10.tsx
+++ b/src/packages/table/demos/h5/demo10.tsx
@@ -12,28 +12,28 @@ interface TableColumnProps {
   width?: number
 }
 const Demo10 = () => {
-  const [data5, setData5] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       age: 4,
     },
   ])
 
-  const [columns5, setColumns5] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -42,7 +42,7 @@ const Demo10 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -63,8 +63,8 @@ const Demo10 = () => {
 
   return (
     <Table
-      columns={columns5}
-      data={data5}
+      columns={columns}
+      data={data}
       onSort={handleSorter}
       style={{ background: '#fff' }}
       sorterIcon={<TriangleDown width="12px" height="12px" />}
diff --git a/src/packages/table/demos/h5/demo11.tsx b/src/packages/table/demos/h5/demo11.tsx
index 3feb548ea9..2e5a3c0d00 100644
--- a/src/packages/table/demos/h5/demo11.tsx
+++ b/src/packages/table/demos/h5/demo11.tsx
@@ -11,45 +11,45 @@ interface TableColumnProps {
   width?: number
 }
 const Demo11 = () => {
-  const [data6, setData6] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       birthday: '2010-01-01',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       birthday: '2000-01-01',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       birthday: '2020-01-01',
       age: 4,
     },
     {
       name: 'Sara',
-      sex: '女',
+      gender: '女',
       record: '高中',
       birthday: '2020-01-01',
       age: 6,
     },
     {
       name: 'Frank',
-      sex: '男',
+      gender: '男',
       record: '幼儿园',
       birthday: '2020-01-01',
       age: 3,
     },
   ])
 
-  const [columns6, setColumns6] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -57,7 +57,7 @@ const Demo11 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -75,8 +75,8 @@ const Demo11 = () => {
   const summaryContent = '这是总结栏'
   return (
     <Table
-      columns={columns6}
-      data={data6}
+      columns={columns}
+      data={data}
       style={{ height: 150 }}
       summary={summaryContent}
     />
diff --git a/src/packages/table/demos/h5/demo12.tsx b/src/packages/table/demos/h5/demo12.tsx
index 5e43eec773..1b0bee8a90 100644
--- a/src/packages/table/demos/h5/demo12.tsx
+++ b/src/packages/table/demos/h5/demo12.tsx
@@ -11,38 +11,38 @@ interface TableColumnProps {
   width?: number
 }
 const Demo12 = () => {
-  const [data6, setData6] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       birthday: '2010-01-01',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       birthday: '2000-01-01',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       birthday: '2020-01-01',
       age: 4,
     },
     {
       name: 'Sara',
-      sex: '女',
+      gender: '女',
       record: '高中',
       birthday: '2020-01-01',
       age: 6,
     },
     {
       name: 'Frank',
-      sex: '男',
+      gender: '男',
       record: '幼儿园',
       birthday: '2020-01-01',
       age: 3,
@@ -61,26 +61,22 @@ const Demo12 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
-      width: 60,
+      key: 'gender',
     },
     {
       title: '学历',
       key: 'record',
-      width: 100,
     },
     {
       title: '生日',
       key: 'birthday',
-      width: 100,
     },
     {
       title: '年龄',
       key: 'age',
-      width: 60,
     },
   ])
 
-  return <Table columns={columnsStickLeft} data={data6} />
+  return <Table columns={columnsStickLeft} data={data} />
 }
 export default Demo12
diff --git a/src/packages/table/demos/h5/demo13.tsx b/src/packages/table/demos/h5/demo13.tsx
index 53400a00cc..3b6000cca0 100644
--- a/src/packages/table/demos/h5/demo13.tsx
+++ b/src/packages/table/demos/h5/demo13.tsx
@@ -11,67 +11,61 @@ interface TableColumnProps {
   width?: number
 }
 const Demo13 = () => {
-  const [data6, setData6] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       birthday: '2010-01-01',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       birthday: '2000-01-01',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       birthday: '2020-01-01',
       age: 4,
     },
     {
       name: 'Sara',
-      sex: '女',
+      gender: '女',
       record: '高中',
       birthday: '2020-01-01',
       age: 6,
     },
     {
       name: 'Frank',
-      sex: '男',
+      gender: '男',
       record: '幼儿园',
       birthday: '2020-01-01',
       age: 3,
     },
   ])
 
-  const [columnsStickRight, setColumnsStickRight] = useState<
-    Array<TableColumnProps>
-  >([
+  const [columnsStickRight] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
       align: 'center',
-      width: 100,
     },
     {
       title: '性别',
-      key: 'sex',
-      width: 60,
+      key: 'gender',
     },
     {
       title: '学历',
       key: 'record',
-      width: 100,
     },
     {
       title: '生日',
       key: 'birthday',
-      width: 100,
     },
     {
       title: '年龄',
@@ -81,6 +75,6 @@ const Demo13 = () => {
     },
   ])
 
-  return <Table columns={columnsStickRight} data={data6} />
+  return <Table columns={columnsStickRight} data={data} />
 }
 export default Demo13
diff --git a/src/packages/table/demos/h5/demo2.tsx b/src/packages/table/demos/h5/demo2.tsx
index 9c6853b750..1e109c8b99 100644
--- a/src/packages/table/demos/h5/demo2.tsx
+++ b/src/packages/table/demos/h5/demo2.tsx
@@ -12,7 +12,7 @@ interface TableColumnProps {
 }
 
 const Demo2 = () => {
-  const [columns2, setColumns2] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -20,7 +20,7 @@ const Demo2 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -28,24 +28,24 @@ const Demo2 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns2} data={data1} bordered={false} />
+  return <Table columns={columns} data={data} bordered={false} />
 }
 export default Demo2
diff --git a/src/packages/table/demos/h5/demo3.tsx b/src/packages/table/demos/h5/demo3.tsx
index f1e6806351..b2b0ef4c1d 100644
--- a/src/packages/table/demos/h5/demo3.tsx
+++ b/src/packages/table/demos/h5/demo3.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo3 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,24 +34,24 @@ const Demo3 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} summary="这是总结栏" />
+  return <Table columns={columns} data={data} summary="这是总结栏" />
 }
 export default Demo3
diff --git a/src/packages/table/demos/h5/demo4.tsx b/src/packages/table/demos/h5/demo4.tsx
index 84c035456c..79684c5e0d 100644
--- a/src/packages/table/demos/h5/demo4.tsx
+++ b/src/packages/table/demos/h5/demo4.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo4 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,24 +34,24 @@ const Demo4 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} striped />
+  return <Table columns={columns} data={data} striped />
 }
 export default Demo4
diff --git a/src/packages/table/demos/h5/demo5.tsx b/src/packages/table/demos/h5/demo5.tsx
index aca124c807..c958189899 100644
--- a/src/packages/table/demos/h5/demo5.tsx
+++ b/src/packages/table/demos/h5/demo5.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo5 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,24 +34,24 @@ const Demo5 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} showHeader={false} />
+  return <Table columns={columns} data={data} showHeader={false} />
 }
 export default Demo5
diff --git a/src/packages/table/demos/h5/demo6.tsx b/src/packages/table/demos/h5/demo6.tsx
index c3b8ccd19a..dbc7378328 100644
--- a/src/packages/table/demos/h5/demo6.tsx
+++ b/src/packages/table/demos/h5/demo6.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo6 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,12 +34,12 @@ const Demo6 = () => {
     },
   ])
 
-  const [data2, setData2] = useState([])
+  const [data] = useState([])
 
   return (
     <>
-      <Table columns={columns1} data={data2} />
-      <Table columns={columns1} data={data2} noData="这里是自定义展示" />
+      <Table columns={columns} data={data} />
+      <Table columns={columns} data={data} noData="这里是自定义展示" />
     </>
   )
 }
diff --git a/src/packages/table/demos/h5/demo7.tsx b/src/packages/table/demos/h5/demo7.tsx
index 135c7da247..5a9889272e 100644
--- a/src/packages/table/demos/h5/demo7.tsx
+++ b/src/packages/table/demos/h5/demo7.tsx
@@ -3,7 +3,7 @@ import { Table, Button, Toast } from '@nutui/nutui-react'
 import { Star } from '@nutui/icons-react'
 
 const Demo7 = () => {
-  const [columns4, setColumns4] = useState([
+  const [columns] = useState([
     {
       title: '姓名',
       key: 'name',
@@ -11,7 +11,7 @@ const Demo7 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -23,10 +23,10 @@ const Demo7 = () => {
     },
   ])
 
-  const [data4, setData4] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       render: () => {
         return (
@@ -42,7 +42,7 @@ const Demo7 = () => {
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       render: () => {
         return <Star height="14px" width="14px" />
@@ -50,7 +50,7 @@ const Demo7 = () => {
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       render: () => {
         return (
@@ -66,6 +66,6 @@ const Demo7 = () => {
     },
   ])
 
-  return <Table columns={columns4} data={data4} />
+  return <Table columns={columns} data={data} />
 }
 export default Demo7
diff --git a/src/packages/table/demos/h5/demo8.tsx b/src/packages/table/demos/h5/demo8.tsx
index 22655977cc..7a898a4a91 100644
--- a/src/packages/table/demos/h5/demo8.tsx
+++ b/src/packages/table/demos/h5/demo8.tsx
@@ -2,36 +2,36 @@ import React, { useState } from 'react'
 import { Table } from '@nutui/nutui-react'
 
 const Demo8 = () => {
-  const [data1] = useState<Array<any>>([
+  const data1 = useState<Array<any>>([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
-  const [data3, setData3] = useState<Array<any>>([])
-  const [columns1, setColumns1] = useState([
+  const [data, setData] = useState<Array<any>>([])
+  const [columns1] = useState([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -42,11 +42,9 @@ const Demo8 = () => {
     },
   ])
   setTimeout(() => {
-    setData3(data1)
+    setData(data1)
   }, 5000)
 
-  return (
-    <Table columns={columns1} data={data3} style={{ background: '#fff' }} />
-  )
+  return <Table columns={columns1} data={data} style={{ background: '#fff' }} />
 }
 export default Demo8
diff --git a/src/packages/table/demos/h5/demo9.tsx b/src/packages/table/demos/h5/demo9.tsx
index 4989942d65..aaf32ce379 100644
--- a/src/packages/table/demos/h5/demo9.tsx
+++ b/src/packages/table/demos/h5/demo9.tsx
@@ -11,28 +11,28 @@ interface TableColumnProps {
   width?: number
 }
 const Demo9 = () => {
-  const [data5, setData5] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       age: 4,
     },
   ])
 
-  const [columns5, setColumns5] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -41,7 +41,7 @@ const Demo9 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -62,8 +62,8 @@ const Demo9 = () => {
 
   return (
     <Table
-      columns={columns5}
-      data={data5}
+      columns={columns}
+      data={data}
       onSort={handleSorter}
       style={{ background: '#fff' }}
     />
diff --git a/src/packages/table/demos/taro/demo1.tsx b/src/packages/table/demos/taro/demo1.tsx
index 637466a326..5313d938fa 100644
--- a/src/packages/table/demos/taro/demo1.tsx
+++ b/src/packages/table/demos/taro/demo1.tsx
@@ -12,11 +12,11 @@ interface TableColumnProps {
 }
 
 const Demo1 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: 'ID',
       key: 'id',
-      render: (record: any, index) => {
+      render: (_record: any, index) => {
         return index + 1
       },
     },
@@ -26,11 +26,11 @@ const Demo1 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -41,24 +41,24 @@ const Demo1 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} />
+  return <Table columns={columns} data={data} />
 }
 export default Demo1
diff --git a/src/packages/table/demos/taro/demo10.tsx b/src/packages/table/demos/taro/demo10.tsx
index 1235ccb369..96698c60b1 100644
--- a/src/packages/table/demos/taro/demo10.tsx
+++ b/src/packages/table/demos/taro/demo10.tsx
@@ -13,28 +13,28 @@ interface TableColumnProps {
   width?: number
 }
 const Demo10 = () => {
-  const [data5, setData5] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       age: 4,
     },
   ])
 
-  const [columns5, setColumns5] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -43,7 +43,7 @@ const Demo10 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -64,8 +64,8 @@ const Demo10 = () => {
 
   return (
     <Table
-      columns={columns5}
-      data={data5}
+      columns={columns}
+      data={data}
       onSort={handleSorter}
       style={{ background: '#fff' }}
       sorterIcon={<TriangleDown size={12} />}
diff --git a/src/packages/table/demos/taro/demo11.tsx b/src/packages/table/demos/taro/demo11.tsx
index dd3c53ba94..624fa5f10a 100644
--- a/src/packages/table/demos/taro/demo11.tsx
+++ b/src/packages/table/demos/taro/demo11.tsx
@@ -13,45 +13,45 @@ interface TableColumnProps {
 
 const Demo11 = () => {
   const summaryContent = '这是总结栏'
-  const [data6, setData6] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       birthday: '2010-01-01',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       birthday: '2000-01-01',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       birthday: '2020-01-01',
       age: 4,
     },
     {
       name: 'Sara',
-      sex: '女',
+      gender: '女',
       record: '高中',
       birthday: '2020-01-01',
       age: 6,
     },
     {
       name: 'Frank',
-      sex: '男',
+      gender: '男',
       record: '幼儿园',
       birthday: '2020-01-01',
       age: 3,
     },
   ])
 
-  const [columns6, setColumns6] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -59,7 +59,7 @@ const Demo11 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -77,8 +77,8 @@ const Demo11 = () => {
 
   return (
     <Table
-      columns={columns6}
-      data={data6}
+      columns={columns}
+      data={data}
       style={{ height: 150 }}
       summary={summaryContent}
     />
diff --git a/src/packages/table/demos/taro/demo12.tsx b/src/packages/table/demos/taro/demo12.tsx
index 97b7e15cb8..ebe015d2e4 100644
--- a/src/packages/table/demos/taro/demo12.tsx
+++ b/src/packages/table/demos/taro/demo12.tsx
@@ -11,47 +11,45 @@ interface TableColumnProps {
   width?: number
 }
 const Demo12 = () => {
-  const [data6, setData6] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       birthday: '2010-01-01',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       birthday: '2000-01-01',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       birthday: '2020-01-01',
       age: 4,
     },
     {
       name: 'Sara',
-      sex: '女',
+      gender: '女',
       record: '高中',
       birthday: '2020-01-01',
       age: 6,
     },
     {
       name: 'Frank',
-      sex: '男',
+      gender: '男',
       record: '幼儿园',
       birthday: '2020-01-01',
       age: 3,
     },
   ])
 
-  const [columnsStickLeft, setColumnsStickLeft] = useState<
-    Array<TableColumnProps>
-  >([
+  const [columnsStickLeft] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -61,26 +59,22 @@ const Demo12 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
-      width: 60,
+      key: 'gender',
     },
     {
       title: '学历',
       key: 'record',
-      width: 100,
     },
     {
       title: '生日',
       key: 'birthday',
-      width: 100,
     },
     {
       title: '年龄',
       key: 'age',
-      width: 100,
     },
   ])
 
-  return <Table columns={columnsStickLeft} data={data6} />
+  return <Table columns={columnsStickLeft} data={data} />
 }
 export default Demo12
diff --git a/src/packages/table/demos/taro/demo13.tsx b/src/packages/table/demos/taro/demo13.tsx
index 34ef76592e..0ad867e3c6 100644
--- a/src/packages/table/demos/taro/demo13.tsx
+++ b/src/packages/table/demos/taro/demo13.tsx
@@ -11,38 +11,38 @@ interface TableColumnProps {
   width?: number
 }
 const Demo13 = () => {
-  const [data6, setData6] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       birthday: '2010-01-01',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       birthday: '2000-01-01',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       birthday: '2020-01-01',
       age: 4,
     },
     {
       name: 'Sara',
-      sex: '女',
+      gender: '女',
       record: '高中',
       birthday: '2020-01-01',
       age: 6,
     },
     {
       name: 'Frank',
-      sex: '男',
+      gender: '男',
       record: '幼儿园',
       birthday: '2020-01-01',
       age: 3,
@@ -56,22 +56,18 @@ const Demo13 = () => {
       title: '姓名',
       key: 'name',
       align: 'center',
-      width: 100,
     },
     {
       title: '性别',
-      key: 'sex',
-      width: 60,
+      key: 'gender',
     },
     {
       title: '学历',
       key: 'record',
-      width: 100,
     },
     {
       title: '生日',
       key: 'birthday',
-      width: 100,
     },
     {
       title: '年龄',
@@ -81,6 +77,6 @@ const Demo13 = () => {
     },
   ])
 
-  return <Table columns={columnsStickRight} data={data6} />
+  return <Table columns={columnsStickRight} data={data} />
 }
 export default Demo13
diff --git a/src/packages/table/demos/taro/demo2.tsx b/src/packages/table/demos/taro/demo2.tsx
index be49520936..92ccb7597d 100644
--- a/src/packages/table/demos/taro/demo2.tsx
+++ b/src/packages/table/demos/taro/demo2.tsx
@@ -12,7 +12,7 @@ interface TableColumnProps {
 }
 
 const Demo2 = () => {
-  const [columns2, setColumns2] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -20,7 +20,7 @@ const Demo2 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -28,24 +28,24 @@ const Demo2 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns2} data={data1} bordered={false} />
+  return <Table columns={columns} data={data} bordered={false} />
 }
 export default Demo2
diff --git a/src/packages/table/demos/taro/demo3.tsx b/src/packages/table/demos/taro/demo3.tsx
index 4db19ed24e..374e14b2c7 100644
--- a/src/packages/table/demos/taro/demo3.tsx
+++ b/src/packages/table/demos/taro/demo3.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo3 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,24 +34,24 @@ const Demo3 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} summary="这是总结栏" />
+  return <Table columns={columns} data={data} summary="这是总结栏" />
 }
 export default Demo3
diff --git a/src/packages/table/demos/taro/demo4.tsx b/src/packages/table/demos/taro/demo4.tsx
index 58510d4470..0b1912cadb 100644
--- a/src/packages/table/demos/taro/demo4.tsx
+++ b/src/packages/table/demos/taro/demo4.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo4 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,24 +34,24 @@ const Demo4 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} striped />
+  return <Table columns={columns} data={data} striped />
 }
 export default Demo4
diff --git a/src/packages/table/demos/taro/demo5.tsx b/src/packages/table/demos/taro/demo5.tsx
index a58d01596f..f048e0b4da 100644
--- a/src/packages/table/demos/taro/demo5.tsx
+++ b/src/packages/table/demos/taro/demo5.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo5 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,24 +34,24 @@ const Demo5 = () => {
     },
   ])
 
-  const [data1, setData1] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
     },
   ])
 
-  return <Table columns={columns1} data={data1} showHeader={false} />
+  return <Table columns={columns} data={data} showHeader={false} />
 }
 export default Demo5
diff --git a/src/packages/table/demos/taro/demo6.tsx b/src/packages/table/demos/taro/demo6.tsx
index 67131ca96c..d5f74c0111 100644
--- a/src/packages/table/demos/taro/demo6.tsx
+++ b/src/packages/table/demos/taro/demo6.tsx
@@ -12,18 +12,18 @@ interface TableColumnProps {
 }
 
 const Demo6 = () => {
-  const [columns1, setColumns1] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
       render: (record: any) => {
         return (
-          <span style={{ color: record.sex === '女' ? 'blue' : 'green' }}>
-            {record.sex}
+          <span style={{ color: record.gender === '女' ? 'blue' : 'green' }}>
+            {record.gender}
           </span>
         )
       },
@@ -34,12 +34,12 @@ const Demo6 = () => {
     },
   ])
 
-  const [data2, setData2] = useState([])
+  const [data] = useState([])
 
   return (
     <>
-      <Table columns={columns1} data={data2} />
-      <Table columns={columns1} data={data2} noData="这里是自定义展示" />
+      <Table columns={columns} data={data} />
+      <Table columns={columns} data={data} noData="这里是自定义展示" />
     </>
   )
 }
diff --git a/src/packages/table/demos/taro/demo7.tsx b/src/packages/table/demos/taro/demo7.tsx
index 60b3ca36e3..4e23090a08 100644
--- a/src/packages/table/demos/taro/demo7.tsx
+++ b/src/packages/table/demos/taro/demo7.tsx
@@ -4,7 +4,7 @@ import { Star } from '@nutui/icons-react-taro'
 import Taro from '@tarojs/taro'
 
 const Demo7 = () => {
-  const [columns4, setColumns4] = useState([
+  const [columns] = useState([
     {
       title: '姓名',
       key: 'name',
@@ -12,7 +12,7 @@ const Demo7 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -24,10 +24,10 @@ const Demo7 = () => {
     },
   ])
 
-  const [data4, setData4] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       render: () => {
         return (
@@ -43,7 +43,7 @@ const Demo7 = () => {
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       render: () => {
         return <Star size="14px" />
@@ -51,7 +51,7 @@ const Demo7 = () => {
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       render: () => {
         return (
@@ -67,6 +67,6 @@ const Demo7 = () => {
     },
   ])
 
-  return <Table columns={columns4} data={data4} />
+  return <Table columns={columns} data={data} />
 }
 export default Demo7
diff --git a/src/packages/table/demos/taro/demo8.tsx b/src/packages/table/demos/taro/demo8.tsx
index a8b0d560c3..6af7334f61 100644
--- a/src/packages/table/demos/taro/demo8.tsx
+++ b/src/packages/table/demos/taro/demo8.tsx
@@ -2,7 +2,7 @@ import React, { useState } from 'react'
 import { Table } from '@nutui/nutui-react-taro'
 
 const Demo8 = () => {
-  const [data1, setData1] = useState<Array<any>>([
+  const [data1] = useState<Array<any>>([
     {
       name: 'Tom',
       sex: '男',
@@ -19,8 +19,8 @@ const Demo8 = () => {
       record: '高中',
     },
   ])
-  const [data3, setData3] = useState<Array<any>>([])
-  const [columns1, setColumns1] = useState([
+  const [data, setData] = useState<Array<any>>([])
+  const [columns] = useState([
     {
       title: '姓名',
       key: 'name',
@@ -42,11 +42,9 @@ const Demo8 = () => {
     },
   ])
   setTimeout(() => {
-    setData3(data1)
+    setData(data1)
   }, 5000)
 
-  return (
-    <Table columns={columns1} data={data3} style={{ background: '#fff' }} />
-  )
+  return <Table columns={columns} data={data} style={{ background: '#fff' }} />
 }
 export default Demo8
diff --git a/src/packages/table/demos/taro/demo9.tsx b/src/packages/table/demos/taro/demo9.tsx
index 839a45b3a7..e876780c21 100644
--- a/src/packages/table/demos/taro/demo9.tsx
+++ b/src/packages/table/demos/taro/demo9.tsx
@@ -12,28 +12,28 @@ interface TableColumnProps {
   width?: number
 }
 const Demo9 = () => {
-  const [data5, setData5] = useState([
+  const [data] = useState([
     {
       name: 'Tom',
-      sex: '男',
+      gender: '男',
       record: '小学',
       age: 10,
     },
     {
       name: 'Lucy',
-      sex: '女',
+      gender: '女',
       record: '本科',
       age: 30,
     },
     {
       name: 'Jack',
-      sex: '男',
+      gender: '男',
       record: '高中',
       age: 4,
     },
   ])
 
-  const [columns5, setColumns5] = useState<Array<TableColumnProps>>([
+  const [columns] = useState<Array<TableColumnProps>>([
     {
       title: '姓名',
       key: 'name',
@@ -42,7 +42,7 @@ const Demo9 = () => {
     },
     {
       title: '性别',
-      key: 'sex',
+      key: 'gender',
     },
     {
       title: '学历',
@@ -63,8 +63,8 @@ const Demo9 = () => {
 
   return (
     <Table
-      columns={columns5}
-      data={data5}
+      columns={columns}
+      data={data}
       onSort={handleSorter}
       style={{ background: '#fff' }}
     />
diff --git a/src/packages/table/table.scss b/src/packages/table/table.scss
index 83596ebac2..07221de69a 100644
--- a/src/packages/table/table.scss
+++ b/src/packages/table/table.scss
@@ -1,7 +1,8 @@
 .nut-table {
   overflow: hidden;
   position: relative;
-
+  word-wrap: break-word;
+  word-break: break-all;
   &-wrapper {
     display: flex;
     width: 100%;