导出阵列列表到React JS中的Excel XLSX
我正在尝试将表导出到Excel文件 ,所以我在获取从数组转换为excel的数据后创建了一个函数,我工作了,但并未导出所有数据 这是一个示例 在这里 因此,如您所见,最后三列是空的,我认为问题是日期是数组数据,但我不知道 这是我的代码:
import {
GridToolbarContainer,
gridVisibleSortedRowIdsSelector,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector
} from "@mui/x-data-grid";
const CustomToolbar = () => {
const apiRef = useGridApiContext();
const getFilteredRows = ({ apiRef }) => gridVisibleSortedRowIdsSelector(apiRef);
const handleExport = (options) => apiRef.current.exportDataAsCsv(options);
const fileType = "application/vnd.ms-excel;charset=utf-8";
const fileExtension = ".xlsx";
const fileName = "myfile";
const buttonBaseProps = {
color: "primary",
size: "small",
};
// const arrayToExcel = (a) => {}
const Export = (a, fileName) => {
const ws = XLSX.utils.json_to_sheet(a);
const wb = { Sheets: { data: ws }, SheetNames: ["data"] };
const excelBuffer = XLSX.write(wb, { bookType: "xlsx", type: "array" });
const data = new Blob([excelBuffer], { type: fileType });
FileSaver.saveAs(data, fileName + fileExtension);
};
const myfiltredRows = (a) => {
const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
let data = filteredSortedRowIds.map((id) => {
const row = {};
visibleColumnsField.forEach((field) => {
row[field] = apiRef.current.getCellParams(id, field).value;
});
return row;
});
let m = JSON.stringify(data, null, 2);
data.map((d) => { (delete d._check_, delete d.action) })
console.info(data)
Export(data, fileName)
// arrayToExcel(data)
};
return (
<GridToolbarContainer>
<Button
{...buttonBaseProps}
onClick={(e) => myfiltredRows(getFilteredRows)
}> Filtered rows</Button>
</GridToolbarContainer>
);
}
这是将我的数组转换为Excel的函数
const Export = (a, fileName) => {
const ws = XLSX.utils.json_to_sheet(a);
const wb = { Sheets: { data: ws }, SheetNames: ["data"] };
const excelBuffer = XLSX.write(wb, { bookType: "xlsx", type: "array" });
const data = new Blob([excelBuffer], { type: fileType });
FileSaver.saveAs(data, fileName + fileExtension);
};
I'm trying to export my table to an excel file
, so I created a function after fetching my data that convert from array to excel, I worked but it does not export all data
this is an example of what am getting
here
so as you can see the last three columns are empty, I think the problem is that the date is array data , but I don't know-how
this is my code :
import {
GridToolbarContainer,
gridVisibleSortedRowIdsSelector,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector
} from "@mui/x-data-grid";
const CustomToolbar = () => {
const apiRef = useGridApiContext();
const getFilteredRows = ({ apiRef }) => gridVisibleSortedRowIdsSelector(apiRef);
const handleExport = (options) => apiRef.current.exportDataAsCsv(options);
const fileType = "application/vnd.ms-excel;charset=utf-8";
const fileExtension = ".xlsx";
const fileName = "myfile";
const buttonBaseProps = {
color: "primary",
size: "small",
};
// const arrayToExcel = (a) => {}
const Export = (a, fileName) => {
const ws = XLSX.utils.json_to_sheet(a);
const wb = { Sheets: { data: ws }, SheetNames: ["data"] };
const excelBuffer = XLSX.write(wb, { bookType: "xlsx", type: "array" });
const data = new Blob([excelBuffer], { type: fileType });
FileSaver.saveAs(data, fileName + fileExtension);
};
const myfiltredRows = (a) => {
const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
let data = filteredSortedRowIds.map((id) => {
const row = {};
visibleColumnsField.forEach((field) => {
row[field] = apiRef.current.getCellParams(id, field).value;
});
return row;
});
let m = JSON.stringify(data, null, 2);
data.map((d) => { (delete d._check_, delete d.action) })
console.info(data)
Export(data, fileName)
// arrayToExcel(data)
};
return (
<GridToolbarContainer>
<Button
{...buttonBaseProps}
onClick={(e) => myfiltredRows(getFilteredRows)
}> Filtered rows</Button>
</GridToolbarContainer>
);
}
this is the function that converts my array to excel
const Export = (a, fileName) => {
const ws = XLSX.utils.json_to_sheet(a);
const wb = { Sheets: { data: ws }, SheetNames: ["data"] };
const excelBuffer = XLSX.write(wb, { bookType: "xlsx", type: "array" });
const data = new Blob([excelBuffer], { type: fileType });
FileSaver.saveAs(data, fileName + fileExtension);
};
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论