做一个表格每个 tD, 有很多信息。
现在发现当我新增第一行,用时 3ms, 到第 40行,要 20ms 一行了
数据结构:
1行 【{td对象},{td对象},{td对象},{td对象}】
2行 【{td对象},{td对象},{td对象},{td对象}】
。。。
每个td对象有下面这些信息
interface TableCell {
is_active:boolean
rc: { r: number, c: number, maxr: number, maxc: number },
value: string | number | Date, // 值
type?: string, // 单元格描述,自定义选择列表,引用数据,关联引用,数据输入,数据导入,数据计算
format?: {
string: { is_active: boolean },
number: { is_active: boolean, round: number, thousand_sep: false, unit: string, pre: string }, // pre是前缀 ,货币标识图案等 Thousand_sep 千分符
percentage: { is_active: boolean, round: number, }, // 百分比
date: { is_active: boolean, format: string, },
custom: { is_active: boolean, format: '', }
},
还有。。一堆。。省略
由于是自定义表格,所有很多信息是没法固定的,这是造成信息多的原因。
现在就面临优化的问题,感觉这样不行。请教优化思路
时间是vue渲数据到dom中的时间还是添加到js集合中的时间?
js集合视乎没什么好办法,数据量在那。。不过题主说的时间应该不是这个
vue渲染的话给dom加上key。
如果是自己手写的代码连续添加,可以先添加到文档片段
中,再一次性添加到dom容器中。
参考这个:
虚拟滚动了解一下, 就是只展示表格可视区域的内容
您好,我是有问必答小助手,您的问题已经有小伙伴帮您解答,感谢您对有问必答的支持与关注!