我尝试了下面链接中提到的相同代码,但由于某种原因,我只能加载(克隆)当前页面中的项目,而不是下一页中的项目????有什么想法吗?
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>
看起来所有分页链接都有类.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>
感谢您的提醒 - 我将更新我之前关于您链接的帖子的答案:)