Question

我有以下代码：

<dom-repeat id="template" items="{{chats}}">
    <template>
      <template is="dom-if" if="[[item.opened]]">
        <section id$="msg-[[index]]"></section>
      </template>
    </template>
</dom-repeat>

如何呈现ID = msg-3的部分，并在呈现后将scrollTop设置为999？

我知道，在聚合物1中，最佳实践是在连接时绑定，并用防抖器等待dom-repeat事件，但是该重复操作在聚合物3中不再起作用。

Answer 1

如果知道索引号，则可以使用;;

let el = this.shadowRoot.querySelector('#msg-'+<index>);

请记住，如果由于使用dom-if进行过滤而未呈现项目，则无法访问此元素。

编辑

为了显示在所选项目的顶部；

let screenPosition = el.getBoundingClientRect();
window.scrollTo(screenPosition);

Demo

如何在Polymer 3.0中访问dom-repeat中的元素？

1 个答案: