[进阶] list 用法#

简介​#

list标签主要用来处理列表中组件重复的使用场景，其需要和item标签结合使用。列表图层使用list标签，item图层使用item标签，会为其创建一个<Item />组件。

例如：

使用示例#

若未安装f2c插件，请阅读F2C 快速上手。

Figma设计稿：https://www.figma.com/design/eQ6iQwUJPCVtZFwSPxdHBv/F2C%E8%BF%9B%E9%98%B6%E7%94%A8%E6%B3%95?node-id=460-1530&t=s3LEruNvD8zoVKK9-4

第一步，将list与item节点按如图添加tag#

第二步，生成代码#

1. 首先是RankList的代码，我们为item节点生成了listData数据
2. list节点会自动创建列表循环代码

1. Item组件被抽取，带有var标签的节点被创建变量入参

更多进阶参考#

list结合subComp用法 F2C系列视频教程