Webix技术咨询：Datalayout的Repeater模式下内部datalayout失效

DevOps 小满

2026-6-23

问题

我尝试用Datalayout展示日期分组的列表，数据结构为日期下包含多个列表项。发现Datalayout的Repeater模式可满足需求，该模式与view:"list"等组件配合正常，但因需要更复杂的样式与响应式设计，不想使用纯HTML。本以为内部嵌套Datalayout是适配的，但使用时所有内部属性均显示undefined，请问Datalayout的Repeater模式是否无法处理内部嵌套的Datalayout？

解答

Datalayout的Repeater模式支持嵌套Datalayout，你遇到的undefined问题是因为数据绑定上下文错误，而非模式本身不支持嵌套。

核心问题分析

外层Datalayout循环父级数据（日期分组）时，内层Datalayout没有正确绑定到当前父项的子数据集合，导致内层无法读取到子项的属性值，从而显示undefined。

修复方案

内层Datalayout需要通过$data引用当前父项的子数据，而非直接使用全局数据源。以下是关键修改点：

内层Datalayout的data属性设置为"$data.items"，绑定到当前日期分组下的子列表项
内层模板或组件中，通过$data.xxx（或直接#xxx#，模板语法支持）读取子项属性

示例代码片段：

{
  view: "datalayout",
  type: "repeater",
  template: "<div class='date-header'>#date#</div>",
  data: yourDataset, // 父级日期分组数据
  rows: [
    {
      view: "datalayout",
      type: "repeater",
      data: "$data.items", // 绑定当前分组的子数据
      template: "<div class='list-item'>#title# - #description#</div>",
      css: "custom-item-layout" // 自定义样式类，用于响应式设计
    }
  ]
}