目录web前端全系列 教程
1839个小节阅读：2244.2k
目录
鸿蒙应用开发
C语言快速入门
JAVA全系列 教程
面向对象的程序设计语言
Python全系列 教程
Python3.x版本，未来主流的版本
人工智能 教程
顺势而为，AI创新未来
大厂算法 教程
算法，程序员自我提升必经之路
C++ 教程
一门通用计算机编程语言
微服务 教程
目前业界流行的框架组合
web前端全系列 教程
通向WEB技术世界的钥匙
大数据全系列 教程
站在云端操控万千数据
AIGC全能工具班
A A
White Night
List 列表组件，包含基本列表样式、长列表性能优化、多端兼容
uni-list组件是父容器，里面的核心是uni-list-item子组件，它代表列表中的一个可重复行，子组件可以无限循环
uni-list-item有很多风格，uni-list-item组件通过内置的属性，满足一些常用的场景
内置属性可以覆盖的场景包括：导航列表、设置列表、小图标列表、通信录列表、聊天记录列表
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| title | String | - | 标题 |
| note | String | - | 描述 |
| badgeText | String | - | 数字角标内容 |
| badgePositon | String | right | 角标位置 |
| avatarCircle | Boolean | false | 是否显示圆形头像 |
| avatar | String | - | 头像地址，avatarCircle 不填时生效 |
| time | String | - | 右侧时间显示 |
| to | String | - | 跳转页面地址，如填写此属性，click 会返回页面是否跳转成功 |
xxxxxxxxxx<uni-list> <uni-list-item title="列表文字1"></uni-list-item> <uni-list-item title="列表文字2"></uni-list-item></uni-list><uni-list> <!-- 显示圆形头像 --> <uni-list-chat :avatar-circle="true" title="uni-app" avatar="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png" note="您收到一条新的消息" time="2020-02-02 20:20"> </uni-list-chat> <!-- 头像显示圆点 --> <uni-list-chat :clickable="true" @click="clickItemHandler" title="uni-app" avatar="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png" note="您收到一条新的消息" time="2020-02-02 20:20" badge-positon="left" badge-text="dot"> </uni-list-chat> <!-- 头像显示角标 --> <uni-list-chat to="../list/list" title="uni-app" avatar="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png" note="您收到一条新的消息" time="2020-02-02 20:20" badge-positon="left" badge-text="99"> </uni-list-chat></uni-list>xxxxxxxxxxexport default { methods: { clickItemHandler(){ console.log("点击列表") } }}实时效果反馈
1. uni-ui中，使用列表组件，哪个属性可以设置角标内容：
A title
B note
C badgeText
D badgePositon
答案
1=>C