在Velo中已知Repeater数据，如何获取对应的容器？

在Velo里，Repeater的容器是动态生成的局部元素，无法通过静态$w()直接获取，必须借助Repeater的forEachItem方法遍历项来定位目标容器。以下是可行的实现代码：

$w.onReady(function () {
    // 字母按钮点击事件处理
    $w('Button').onClick((event) => {
        const targetLetter = event.target.id;
        const repeater = $w('#repeater1');
        
        // 遍历Repeater所有项，匹配目标容器
        repeater.forEachItem(($item, itemData) => {
            if (itemData.nazwisko[0] === targetLetter) {
                // 滚动到匹配的容器，可添加behavior参数实现平滑滚动
                $item('#container1').scrollTo({ behavior: 'smooth' });
                return; // 找到首个匹配项后终止遍历
            }
        });
    });
});

关键说明 #

1. 动态元素访问：Repeater的容器属于每个项的局部元素，必须通过forEachItem回调中的$item对象访问，全局$w()无法识别动态生成的容器实例。
2. 滚动生效条件：确保容器所在的页面或父容器开启了滚动功能，否则scrollTo()不会有效果；behavior: 'smooth'为可选参数，用于实现平滑滚动。
3. 直接数据匹配：无需额外给容器绑定标识，直接通过itemData中的姓氏首字母字段比对即可定位目标项。

为什么之前的方法无效 #

• 静态ID获取失败：Repeater容器的ID是每个项的局部ID，仅在$item上下文内有效，全局$w()无法识别。
• 无children属性：Velo组件模型和原生DOM不同，不支持直接通过children遍历子元素，必须使用官方提供的forEachItem方法。
• 禁止DOM操作：Velo出于安全和兼容性考虑，限制了直接操作DOM，必须使用官方API实现需求。

内容的提问来源于stack exchange，提问作者Kacper Konarzewski