给我用React 函数组件封装一个 ant table的表格 要求只封装table的组件 封装的功能包括是否显示单选复选框 斑马线 等属性 耦合度低 数据用死数据 达到效果开箱即用

好的，以下是一个基于 Ant Design 的 Table 组件的封装，支持单选、多选、斑马线等属性：

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

const CustomTable = ({
  dataSource, // 数据源
  columns, // 表头配置
  rowSelection, // 行选择配置，包括 type 和 onChange
  rowKey, // 行 key 的取值
  stripe, // 是否显示斑马线，默认为 true
}) => {
  return (
    <Table
      dataSource={dataSource}
      columns={columns}
      rowSelection={rowSelection}
      rowKey={rowKey}
      striped={stripe}
    />
  )
}

export default CustomTable;

使用方法：

import React from 'react';
import CustomTable from './CustomTable';

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 columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
  },
  {
    title: 'Address',
    dataIndex: 'address',
    key: 'address',
  },
];

const rowSelection = {
  type: 'checkbox', // 默认为单选，可选值为 'radio' 或 'checkbox'
  onChange: (selectedRowKeys, selectedRows) => {
    console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
  },
};

const App = () => {
  return (
    <CustomTable
      dataSource={data}
      columns={columns}
      rowSelection={rowSelection}
      rowKey="key"
      stripe={true}
    />
  );
}

export default App;