html中使用antd table

在HTML中使用Ant Design (AntD) Table，你可以创建高效、美观的表格组件。AntD是一个基于React的UI库，提供了一套丰富的数据表格解决方案。以下是基本步骤：

1. **安装AntD**: 首先，你需要在项目中安装AntD Table组件。如果你使用的是npm或yarn，可以在终端中运行：

   npm install antd
   // 或者
   yarn add antd

2. **引入组件**: 在你的React组件文件中，导入Table组件和其他需要的样式：

   import React from 'react';
   import { Table, Column } from 'antd';
   import 'antd/dist/antd.css'; // 引入主题样式

3. **创建Table**: 创建一个新的Table元素，并设置列配置（columns）、数据源（dataSource），以及表头（headerRowKey）等属性：

   const columns = [
     {
       title: '姓名',
       dataIndex: 'name',
     },
     {
       title: '年龄',
       dataIndex: 'age',
     },
     {
       title: '地址',
       dataIndex: 'address',
     },
   ];

   const data = [
     { key: '1', name: '张三', age: 32, address: '上海市' },
     { key: '2', name: '李四', age: 45, address: '北京市' },
   ];

   function MyTable() {
     return (
       <Table
         columns={columns}
         dataSource={data}
         headerRowKey="key"
       />
     );
   }

4. **渲染组件**:
现在可以将`MyTable`组件添加到你的React应用中，展示表格数据。