时间戳

首页 > 解决方案 > ember 垂直集合仅在单击时呈现

ember.js - ember 垂直集合仅在单击时呈现

问题描述

当我使用来自https://github.com/html-next/vertical-collection的 ember 垂直集合时，它只会在屏幕上单击时呈现新组件，而在滚动时不会呈现新组件。这是下面的代码

{{#vertical-collection model estimateHeight=90 bufferSize=5 staticHeight=true lastReached="loadBelow" as |item|}}
        -----
    {{/vertical-collection}}

标签： ember.js

解决方案

检查添加滚动事件的容器选择器。面临类似的问题。问题是我有一个增长的父容器 div (flex-grow:1)，我将它containerSelector作为包含该vertical-collection组件的子元素传递。将其替换为父 div 选择器，现在可以正常工作。

<div class="inline-slider-header"></div>
<div class="inline-slider-body"> <!-- Has a styling of flex-grow:1 -->
  <div class="list-container">
    {{#vertical-collection this.items
      tagName="div"
      estimateHeight=47
      bufferSize=3
      containerSelector=".inline-slider-body"
      renderAll=false
      as |item index|
    }}
      <div class="item">
        <p>{{index}}</p>
        <p>{{item.title}}</p>
      </div>
    {{/vertical-collection}}
  </div>
</div>
<div class="inline-slider-footer"></div>

推荐阅读