Question

我尝试了以下链接中提到的相同代码，但出于某种原因，出于某种原因，它仅加载（克隆）当前页面中的项目，而不加载下一页中的项目？有什么想法吗？

How to add Infinite Scroll to BigCommerce Category page

<ul class="productGrid" data-infinite-scroll='{ "path": ".pagination-link", "append": ".product", "history": false }'>
{{#each products}}
<li class="product">
    {{>components/products/card show_compare=../show_compare show_rating=../settings.show_product_rating theme_settings=../theme_settings customer=../customer}}
</li>
{{/each}}
</ul>


<script src="https://unpkg.com/infinite-scroll@3/dist/infinite-scroll.pkgd.js"></script>

Answer 1

似乎所有分页链接都具有类.pagination-link，包括带编号的链接（1、2、3等）。发生的情况是Infinite Scroll库正在使用该类捕获第一个元素，恰好是page = 1，因此这是要附加的第一页。

尝试将您的代码更新为此，以指定路径链接应为“下一个”分页链接：

<ul class="productGrid" data-infinite-scroll='{ "path": ".pagination-item--next .pagination-link", "append": ".product", "history": false }'>
    {{#each products}}
    <li class="product">
            {{>components/products/card settings=../settings show_compare=../show_compare show_rating=../settings.show_product_rating theme_settings=../theme_settings customer=../customer event=../event position=(add @index 1)}}
    </li>
    {{/each}}
</ul>

感谢大家注意，我会在您链接到的帖子上更新我以前的答案：）

Infinite Scroll.js在滚动条上加载相同的产品，而不是下一页上的产品-BigCommerce问题？

1 个答案: