list-view.md 1.6 KB
Newer Older
D
DCloud_LXH 已提交
1
## list-view
D
DCloud_LXH 已提交
2 3 4

<!-- UTSCOMJSON.list-view.description -->

W
更x  
wanganxp 已提交
5 6 7 8 9 10 11 12
在App中,基于recycle-view的list,才能实现长列表的资源自动回收,以保障列表加载很多项目时,屏幕外的资源被有效回收。list-view就是基于recycle-view的list组件。

每个list由1个父组件list-view及若干子组件list-item构成。

在list-item上使用v-for指令循环list-item,自动会回收屏幕外的列表项资源。

list-view和scroll-view都是滚动组件,list适用于长列表场景,其他场景适用于scroll-view。

shutao-dc's avatar
shutao-dc 已提交
13 14
注意: list-view仅识别list-item组件其他组件无法识别不能正常显示

D
DCloud_LXH 已提交
15 16
<!-- UTSCOMJSON.list-view.attrubute -->

D
DCloud_LXH 已提交
17 18
<!-- UTSCOMJSON.list-view.event -->

D
DCloud_LXH 已提交
19 20 21 22 23
<!-- UTSCOMJSON.list-view.compatibility -->

<!-- UTSCOMJSON.list-view.reference -->


D
DCloud_LXH 已提交
24
## list-item
D
DCloud_LXH 已提交
25 26 27 28 29

<!-- UTSCOMJSON.list-item.description -->

<!-- UTSCOMJSON.list-item.attrubute -->

D
DCloud_LXH 已提交
30 31
<!-- UTSCOMJSON.list-item.event -->

D
DCloud_LXH 已提交
32 33 34 35
<!-- UTSCOMJSON.list-item.compatibility -->

<!-- UTSCOMJSON.list-item.reference -->

W
更x  
wanganxp 已提交
36 37
## 示例代码

W
x  
wanganxp 已提交
38
- 联网联表:[https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/template/list-news/list-news.uvue](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/template/list-news/list-news.uvue)
W
更x  
wanganxp 已提交
39 40 41 42
- 可左右滑动的多个列表:[https://gitcode.net/dcloud/hello-uni-app-x/-/tree/master/pages/template/long-list](https://gitcode.net/dcloud/hello-uni-app-x/-/tree/master/pages/template/long-list)

## Bug&Tips

W
x  
wanganxp 已提交
43
- 暂不支持reverse,目前还不能开发im那样的倒序列表
shutao-dc's avatar
shutao-dc 已提交
44
- 多列瀑布流是另外的组件,后续会提供