硬件开发工具链平台云服务-高级面板设置:循环渲染

时间：2024-09-24 14:28:47

循环渲染

页面可能有许多重复的、动态生成的内容，如：列表页、表格数据等，这时候，就需要用到循环渲染。

可以在高级面板中指定循环数据绑定的变量、迭代的变量名、索引变量名、以及唯一的key。

举例：假如状态变量中有一个申请单列表list，希望渲染出申请单的名称、申请单Key以及版本，那么可以使用循环渲染来实现。

// 申请单list 实例数据
const list = [
  {
    "name": "申请单1",
    "key": "Process1",
    "version": "1"
  },
  {
    "name": "申请单2",
    "key": "Process2",
    "version": "2"
  },
  {
    "name": "申请单3",
    "key": "Process3",
    "version": "3"
  }
]

图2 循环渲染