我正在对一个数组进行分页,当我滚动到页面底部时,我正在每页加载页面。不幸的是,我的数组的某些块似乎不断返回,而不是新加载的数组位。知道这是怎么回事吗?
这是我的infinite_scroll_controller.js
import Rails from '@rails/ujs';
export default class extends Controller {
static targets = ["entries", "pagination"]
scroll(){
let next_page = this.paginationTarget.querySelector("a[rel='next']")
if (next_page == null) { return }
let url = next_page.href
var body = document.body,
html = document.documentElement
var height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight)
if (window.pageYOffset >= height - window.innerHeight - 100) {
console.log("bottom")
this.loadMore(url)
}
}
loadMore(url){
Rails.ajax({
type: 'GET',
url: url,
dataType: 'json',
success: (data) => {
console.log(data)
this.entriesTarget.insertAdjacentHTML('beforeend', data.entries)
this.paginationTarget.innerHTML = data.pagination
}
})
}
}```
This is in my listing controller
``` @listings = Listing.all.sort_by { |listing| listing.created_at }.reverse!
@pagy_a, @loaded_listings = pagy_array(@listings)
respond_to do |format|
format.html
format.json {
render json: { entries: render_to_string(partial: "listings", formats: [:html]), pagination: view_context.pagy_nav(@pagy_a) }
}
end```