树形List的设计

superycman

需求是一个能达5层嵌套的树形列表，效果如下图所示：

需求界面

因为tree和grid等无法实现该种图形效果，采用了嵌套List实现。
在论坛查阅资料后，嵌套List采用http://docs.wex5.com/wex5-ui-question-list-2005/里面的方案实现。
文中提及2层以上的嵌套对性能影响较大。
请问有什么方法可以减少对性能的影响？data动态加载数据？
或者不使用List能否有其他方法实现上图效果？

jishuang

pc端显示可以直接用grid显示树形数据

移动端要这样的格式就需要用list嵌套，但是list嵌套是要求所有的数据都加载的，数据多肯定会影响性能

superycman

jishuang 发表于 2018-3-26 16:26
pc端显示可以直接用grid显示树形数据

移动端要这样的格式就需要用list嵌套，但是list嵌套是要求所有的数据 ...

grid做不到图片的效果吧

jishuang

grid设置树形显示
http://docs.wex5.com/comps-tree-grid/

superycman

jishuang 发表于 2018-3-26 16:53
grid设置树形显示
http://docs.wex5.com/comps-tree-grid/

我的意思是实现如下图的树形列表，既要树形结构，也要按这个图形样式template。页面效果：

tempalte：


问题一：grid和tree能不能自定义template？

问题二：如果采用List嵌套去实现，通过动态载入数据是否能降低嵌套List对性能的影响？
问题三：如果采用List嵌套去实现，有没有什么设计方法可以降低嵌套List对性能的影响？
问题四：要实现上图页面效果（视觉+结构）的树形列表，除了List有没有其他方式？

jishuang

可以自己修改grid显示tree的相关样式啊
1.不能
2.List嵌套，必须在list加载的时候数据都给出来，否则不会过滤
3.没有好的方案
4.要树形就用grid没有其他的组件，或者到网上查找jquery是否有这样的插件引用第三方插件

changda

jishuang 发表于 2018-3-26 17:28
可以自己修改grid显示tree的相关样式啊
1.不能
2.List嵌套，必须在list加载的时候数据都给出来，否则不会过 ...

我的思路是，
1，前台需要实现这样的展示样式，那么采用list嵌套（业务规则可以规定树形数据不能多于5层），因此嵌套不会多于五层。
2，为了解决树形数据一次性加载慢的问题，采用动态分层加载。定义5个data分别存放5层的数据data1,data2,data3,data4,data5。然后第一次加载的时候仅加载第一层（全部）到data1，点击data1的某个数据时，再加载这个数据的子（第二层），以此类推。data1,data2,data3,data4,data5建立主次关系。

这样可否？

jishuang

前面已经说了list嵌套需要数据提前加载，否则不会显示，也不会过滤数据

superycman

jishuang 发表于 2018-3-27 09:17
前面已经说了list嵌套需要数据提前加载，否则不会显示，也不会过滤数据

如果动态建立嵌套的子list，能否实现延迟加载

jishuang

list嵌套filter是需要提前设置好的，而且是循环每行都有，怎么动态建立的？