setDataSource页面崩溃

收藏

async workbookInitialized(value) {
initializeFunctions(GC);
if (this.isDesigner) {
//designer设计器的方法
this.designer = value;
this.spread = this.designer.getWorkbook();
this.getTemplateParamList();
// this.changeOpenMenu();
} else {
// 将传入的 value（电子表格实例）分配给 this.spread
this.spread = value;
// this.changeOpenMenu();
}
// 设置 tabStripPosition 为 1
this.spread.options.tabStripPosition = 1;
// 刷新电子表格视图
this.spread.invalidateLayout();
this.spread.repaint();
// 暂停电子表格的绘制
this.spread.suspendPaint();
//禁用delete
let commandManager = this.spread.commandManager();
commandManager.register("clearcontent", {
canUndo: true,
execute: function () {
// Do nothing to prevent delete
return true;
},
});
commandManager.setShortcutKey(
"clearcontent",
GC.Spread.Commands.Key.del,
false,
false,
false,
false
);
//监听sheet页的切换
let now = this;
this.addSheetChangedListener(this.spread, function (newSheetName) {
console.log("切换到新的工作表：" + newSheetName);
now.activeSheetName = newSheetName;
});
try {
// 获取与 sampleTaskCode 相关的数据
const result = await getSampleTaskOriginalRecordsByTaskId(
this.$route.query.sampleTaskCode || this.sampleTaskCode
);
// 如果成功获取数据
if (result.data.success) {
// 如果 fileUrl 存在
if (result.data.result.fileUrl) {
// 更新组件数据
this.form = result.data.result;
this.flowStatus = result.data.result.flowStatus;
this.showPrint = result.data.result.pdfFileUrl ? true : false;
this.pdfFileUrl = result.data.result.pdfFileUrl;
this.pdfFileTitle = result.data.result.pdfFileTitle;
this.experienceItemId = result.data.result.experienceItemId;
this.printId = result.data.result.id;
this.experienceItemParamNames =
result.data.result.experienceItemParamNames;
if (result.data.result.immutableDataJson) {
this.dirtyDataObject = JSON.parse(
result.data.result.immutableDataJson
);
}
this.reportConcentrate = JSON.parse(
result.data.result.variableDataJson
);
// 下载文件并处理数据
const source = await downLoadApi(result.data.result.fileUrl);
// 读取文件内容
const reader = new FileReader();
reader.readAsText(source.data, "utf-8");
reader.onload = (e) => {
// 解析文件内容为 JSON
let json = JSON.parse(e.currentTarget.result);
// 将 JSON 数据导入到电子表格中
this.spread.fromJSON(json);
// 获取电子表格中的工作表数量
let index = this.spread.getSheetCount();
// 遍历所有工作表
for (let i = 0; i <= index - 1; i++) {
// 解析 extendDataJson
let obj = JSON.parse(result.data.result.extendDataJson);
let data = {};
// 获取当前工作表的数据
if (obj) {
data = obj[this.spread.getSheet(i).name()]
? obj[this.spread.getSheet(i).name()]
: {};
}
// 深拷贝数据
data = JSON.parse(JSON.stringify(data));
//对JSON中的数据尽量转换类型，防止excel无法计算
// 从Object.prototype获取hasOwnProperty方法的引用，以安全地检查对象自有属性
const hasOwn = Object.prototype.hasOwnProperty;
// 遍历data对象的所有属性
for (let key in data) {
// 使用hasOwnProperty.call方法检查data对象是否真正拥有当前迭代的key属性，
// 而不是从原型链上继承来的。这样做可以避免因对象被恶意修改原型链或属性被意外覆盖而导致的错误。
if (hasOwn.call(data, key)) {
// // 特殊处理"制样日期"，将其转换为Date对象
// if (key === "制样日期") {
// data[key] = new Date(data[key]);
// }
// // 特殊处理"委托日期"，应用自定义的日期格式化函数
// else if (key === "委托日期") {
// data[key] = this.formatDateToStr(data[key]);
// }
// // 对于其他所有属性，尝试将其转换为Number类型
// else {
data[key] = this.convertToNumberOrDate(data[key]);
// }
}
}
// if (data["公称直径"]) {
// data["公称直径"] = Number(data["公称直径"]);
// }
// if (data["制样日期"]) {
// data["制样日期"] = new Date(data["制样日期"]);
// // data["制样日期"] = "2022年7月8日";
// }
// if (data["委托日期"]) {
// data["委托日期"] = this.formatDateToStr(data["委托日期"]);
// }
// 创建数据源
let dataSource =
new GC.Spread.Sheets.Bindings.CellBindingSource(data);
// 如果数据是数组类型
if (Array.isArray(data)) {
// 设置工作表的数据源
this.deviceData = data;
this.spread.getSheet(i).setDataSource(data);
// 设置列宽
for (let J = 0; J <= 16; J++) {
this.spread.getSheet(i).setColumnWidth(J, 200);
}
} else {
// 设置工作表的数据源
console.log(dataSource, "======");
this.spread.getSheet(i).setDataSource(dataSource);
}
// this.autoFitRowOnSetDataSource(this.spread.getSheet(i));
// this.spread.getSheet(i).recalcAll();
}
// 重置设置 tabStripPosition 为 1
this.spread.options.tabStripPosition = 1;
// 刷新电子表格视图
this.spread.invalidateLayout();
this.processReports(this.spread);
// this.autoFitRowOnValueChanged(value);
this.SelectionChanged(this.spread);
this.CellChanged(this.spread);
//获取设备缓存列表
this.getDeviceCache();
};
} else {
this.$message.error("获取模板失败");
}
} else {
this.$message.error("获取详情失败");
}
} catch (error) {
// 输出错误信息并显示错误提示
console.error(error);
this.$message.error("发生错误");
}
// 恢复电子表格的绘制
this.spread.resumePaint();
},

复制代码

现在遇到一个问题，前端spreadjs在页面初始化的时候，给页面setDataSource，页面直接崩溃了，这个是什么原因导致的

硕㏒ · 硕㏒

sheet页数量少，datasource内容也少的情况下，不会崩溃

Joestar.Xu · Joestar.Xu

您好，从代码上不太能看出问题，需要您提供一下相关的模板文件和数据源JSON，这边复现后调研一下看看。

硕㏒ · 硕㏒

附件中是文件和datasource

Joestar.Xu · Joestar.Xu

您好，这边在17.0.10中测试了一下，没有复现出您这个问题，测试代码如下：

image.png896039123.png

建议您先升级到17.0.10测试看看，如果仍然存在此问题，请您提供一个可以复现此问题的Demo，这边帮您调研一下看看。

		自动登录	找回密码
密码			立即注册

[处理中] setDataSource页面崩溃

4 个回复

SpreadJS 认证

SpreadJS 高级认证