将您的代码改为下图中所示,可以解决此问题
修改之后效果为如下图所示:
designer组件与spread组件加载数据时间相差不大,同时切换sheet,也不存在卡顿或者需要上下滚动才需要出现的情况。
原因是:
您不应该将复杂的 javascript 对象缓存到全局 vue3 变量,vue3 将使用代理包装该对象,这将破坏 javascript 对象的生命周期。
这里需要spread,可以通过
- var spread = this.designer.getWorkbook();
复制代码 来获取。
designerInitialized代码为:
- this.designer = designer;
- var spread = designer.getWorkbook();
- console.time("designer渲染数据时间")
- spread.fromJSON(json1, {
- ignoreFormula: false,
- ignoreStyle: false,
- frozenColumnsAsRowHeaders: false,
- frozenRowsAsColumnHeaders: false,
- doNotRecalculateAfterLoad: false
- });
- this.sourceBind(spread)
- console.timeEnd("designer渲染数据时间")
复制代码
|