5.20211.781 angular 列选择严重卡顿和虚拟滚动

ttnkh21 发表于 2021-5-7 15:28:06

数据列有两三万行，三四十列的样子，原用ngzorro列表，主要功能：
1，动态选择要显示的列和保存，并在下次打开时，显示保存的列。
2，动态移动列的位置并保存。
3，前端复杂条件检索和排序。
4，增删改查等基础操作。
最近尝试使用wijmo, 遇到如下问题。
1，一次性加载所有列，在选择要显示的列时，卡顿严重。

2，尝试使用虚拟滚动，发现并非真正的虚拟滚动，而是懒加载，这样的话，搜索要如何解决呢？放到后端吗？
3，angular如何保存和设置要显示的列，在下次加载时，隐藏不需要显示的列？
4，angular如果保存拖动后列的位置？

Richard.Ma 发表于 2021-5-7 15:28:07

列头设置可以在app.component.html中定义，比如这个示例

https://demo.grapecity.com.cn/wijmo/demos/Grid/Columns/ColumnWidth/angular

Richard.Ma 发表于 2021-5-7 16:08:16

问题已经收到，因为问题较多。我这边统一验证后给您答复

Richard.Ma 发表于 2021-5-8 11:44:08

1.这个暂时没有好的解决办法，

2.是的，或者说是按需加载，全局搜索的话得在后台进行。你说的真正的虚拟加载是指什么呢

3.这个demo最下端就有保存布局和加载布局的示例代码，通过flex.columnLayout即可获取设置布局
https://demo.grapecity.com.cn/wijmo/demos/Grid/Columns/ColumnPicker/purejs

4.和问题3设置方式相同

ttnkh21 发表于 2021-5-10 08:58:47

感谢版主大大周末还回复:lol

我说的那个虚拟滚动指的是这个 VirtualScroll 属性。只渲染当前显示的行和列。
另外，flex.columnLayout 不起作用，是我的用法不对吗？
表头并没有根据columnLayout设置的加载。

ttnkh21 发表于 2021-5-10 09:05:28

刚刚发现，是生命周期的问题，用的angular11.2

两个生命周期函数都不可以，加了时间延时函数后，会起作用，但是，页面会闪烁一下后再变过来。
有什么好的办法吗？

Richard.Ma 发表于 2021-5-10 10:07:57

我这里测试没有重现问题，简单的给布局删了第二列，不需要加延时就行，建议你直接通过获取columnlayout再进行修改
   var layout=JSON.parse(this.flex.columnLayout);
   layout.columns.splice(1,1);
   console.log(layout);
   this.flex.columnLayout=JSON.stringify(layout);

ttnkh21 发表于 2021-5-10 10:34:16

Richard.Ma 发表于 2021-5-10 10:07
我这里测试没有重现问题，简单的给布局删了第二列，不需要加延时就行，建议你直接通过获取columnlayout再进 ...

好的，我试一下。
angular 有办法像 js一样在初始化的时候添加列头设置吗？

这样好像数据不是双绑的。

页: [1]

葡萄城开发者社区's Archiver

5.20211.781 angular 列选择严重卡顿和虚拟滚动