antd table 点击按钮增加一行数据

首先，在你的表格中添加一个按钮，然后给它绑定一个点击事件。在点击事件中，你可以通过以下方式向表格中添加一行数据：

1. 在你的组件状态中定义一个数组，用于保存表格中的数据；
2. 在点击事件中创建一个新的数据对象，并将其添加到数据数组中；
3. 更新组件状态以反映新的数据数组。

以下是一个示例代码，演示如何增加一行数据到 Antd 表格中：

import React, { useState } from 'react';
import { Table, Button } from 'antd';

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
  },
  {
    title: 'Address',
    dataIndex: 'address',
    key: 'address',
  },
];

const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park',
  },
  {
    key: '2',
    name: 'Jim Green',
    age: 42,
    address: 'London No. 1 Lake Park',
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
    address: 'Sidney No. 1 Lake Park',
  },
];

const App = () => {
  const [tableData, setTableData] = useState(data);

  const handleAddRow = () => {
    const newRow = {
      key: Date.now(), // 自动生成一个唯一的 key
      name: 'New Person',
      age: 18,
      address: 'New Address',
    };

    setTableData([...tableData, newRow]);
  };

  return (
    <>
      <Button onClick={handleAddRow}>Add Row</Button>
      <Table columns={columns} dataSource={tableData} />
    </>
  );
};

export default App;

在上面的示例代码中，我们首先定义了一个 `tableData` 状态变量，用于保存表格中的数据。然后，在点击事件中，我们创建了一个新的数据对象 `newRow`，并将其添加到 `tableData` 中。最后，我们更新了组件状态，以反映新的数据数组。

注意，我们在 `newRow` 对象中添加了一个自动生成的 `key` 属性，以确保每行数据都具有一个唯一的标识。这是 Antd 表格要求的。