循环与table结合，列出多个table,并给出代码，react结合antdesign

以下是一个使用React和Ant Design的例子，其中循环生成了多个Table组件。

import React from 'react';
import { Table } from 'antd';

const data1 = [
  { 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 data2 = [
  { key: '1', name: 'Jack Brown', age: 28, address: 'New York No. 2 Lake Park' },
  { key: '2', name: 'Jill Green', age: 38, address: 'London No. 2 Lake Park' },
  { key: '3', name: 'Jane Black', age: 28, address: 'Sidney No. 2 Lake Park' },
];

const tablesData = [
  { title: 'Table 1', data: data1 },
  { title: 'Table 2', data: data2 },
];

const App = () => {
  return (
    <>
      {tablesData.map((table) => (
        <Table key={table.title} title={() => table.title} dataSource={table.data} columns={[
          { title: 'Name', dataIndex: 'name', key: 'name' },
          { title: 'Age', dataIndex: 'age', key: 'age' },
          { title: 'Address', dataIndex: 'address', key: 'address' },
        ]} />
      ))}
    </>
  );
};

export default App;

这将生成两个带有标题的Table组件，每个组件都有不同的数据源和列设置。您可以根据需要添加更多的Table组件到tablesData数组中。