列表
列表显示一组相关的纯文本内容。每个列表项都以项目符号或数字开头。
用于相关项目的纯文本列表,不需要按特定顺序排列,也不需要图标或其他指示符。
进口{列表}从“@shopify /北极星”;进口反应从“反应”;函数ListExample(){返回(<列表类型=“子弹”><列表。项>黄色的衬衫</列表。项><列表。项>红衫军</列表。项><列表。项>绿色的衬衫</列表。项></列表>);}
道具
想让这个功能变得更好吗?请分享你的反馈。
接口
ListProps
- 类型? “子弹”|“数量”
-
要显示的列表类型。
默认为“子弹”。
- 孩子们? 反应。ReactNode
-
列出项目元素。
最佳实践
列表:
- 将相关内容分割成大块,让商家更容易浏览信息
- 措辞要一致(尽量在每一项开头都用名词或动词,并保持一致)OB欧宝娱乐APP
- 不能用于整个项表示操作的列表
内容的指导方针
列表项
清单中的每一项都应该:
- OB欧宝娱乐APP以大写字母开头
- 不要在每行的末尾使用逗号或分号
做
- 红色的
- 黄色的
- 蓝色的
不
- 红色;
- 黄色;
- 蓝色的。
- 用句格书写
做
- 项目一个
- 两个项
- 项目三
不
- 项目一个
- 两个项
- 项目三
相关的组件
- 若要创建复选框或单选按钮列表,使用选择列表组件
- 要表示相同类型的对象(如客户、产品或订单)的集合,使用资源列表组件
- 当每个项目的文本标签对描述内容有用时,使用Description List组件
可访问性
list组件输出列表项(<李>
)内的列表包装器(< ul >
对于项目符号列表或< ol >
用于编号列表)。默认情况下,列表项作为一组相关元素传递给辅助技术用户。
若要仅为布局对项目进行分组,请考虑使用堆栈组件。