安装

使用npm或yarn

npm install --save table-xlsx @pengchen/xlsx# oryarn add table-xlsx @pengchen/xlsx

note

⚡️ SheetJS/js-xlsx社区版本不支持样式，您可以使用@pengchen/xlsx(基于js-xlsx@0.17.0修改)
💸 当然，您也可以直接使用SheetJS Pro版本

使用CDN

<!-- 注意: 部署时，将 "development.umd.js" 替换为 "production.umd.js"--><script crossorigin src="https://unpkg.com/table-xlsx/dist/table-xlsx.development.umd.js"></script>

如果使用CDN的方式引入table-xlsx，建议设置crossorigin属性

CDN Availability (click to show)

CDN	URL
unpkg	https://unpkg.com/table-xlsx/
jsDelivr	https://jsdelivr.com/package/npm/table-xlsx

使用

导出xlsx

import { exportFile } from 'table-xlsx';
const dataSource = [  { key: '1', name: '胡彦斌', age: 32, address: '西湖区湖底公园1号', },  { key: '2', name: '胡彦祖', age: 42, address: '西湖区湖底公园1号', },];
const columns = [  { title: '姓名', dataIndex: 'name', key: 'name', },  { title: '年龄', dataIndex: 'age', key: 'age', },  { title: '住址', dataIndex: 'address', key: 'address', },];
exportFile({  columns: columns,  dataSource: dataSource,});

解析xlsx

import { parseFile } from 'table-xlsx';
parseFile({file}).then((result) => {  const { columns, dataSource } = result.tables[0];  setDataSource(dataSource);  setColumns(columns);});
<Table  dataSource={dataSource}  columns={columns}/>