Я взглянул на этот пример https://cloud.google.com/firestore/docs/query-data/query-cursors => Paginate a query, чтобы разбить мои данные из firestore на страницы.
Загрузка данных работает нормально, и я получаю свои посты .limit(3), если дохожу до конца страницы.
Но если я снова прокручиваю вниз, функция снова запускается, это здорово, но она снова загружает те же данные и не загружает больше сообщений из firestore.
Надеюсь, кто-то может мне помочь, спасибо!
Код: vuejs
mounted() {
this.loadMoreData();
},
methods: {
loadMoreData(posts) {
window.onscroll = async () => {
let bottomOfWindow =
document.documentElement.scrollTop + window.innerHeight ===
document.documentElement.offsetHeight;
var vm = this;
const db = firebase.firestore()
function getMorePosts() {
let first = db
.collection("users")
.doc(vm.userProfile.general.userId)
.collection("posts")
.orderBy("createdOn", "desc")
.limit(3);
return first.get().then(async documentSnapshots => {
// Get the last visible document
console.info(documentSnapshots);
var lastVisible =
documentSnapshots.docs[documentSnapshots.docs.length - 1];
console.info("last", lastVisible);
// Construct a new query starting at this document,
// get the next 3 posts.
const next = db
.collection("users")
.doc(vm.userProfile.general.userId)
.collection("posts")
.orderBy("createdOn", "desc")
.startAfter(lastVisible)
.limit(3)
.onSnapshot(snapshot => {
const allPosts = [];
snapshot.forEach(doc => {
allPosts.push(doc.data());
});
// set data to vuex
vm.$store.commit("posts/setProducts", allPosts);
});
});
}
if (bottomOfWindow) {
getMorePosts();
console.info("bottom");
}
}



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Из кода, которым вы поделились, функция getMorePosts() получает первые три сообщения и находит последнее сообщение. Затем он запрашивает следующие 3 сообщения, используя документ last visible в первом запросе в качестве курсора.
Проблема в том, что функция всегда выполняет одно и то же действие, чтобы получить первые 3 сообщения и получать следующие 3 сообщения каждый раз, когда вы прокручиваете страницу вниз.
Один из способов решить эту проблему — передать последний видимый элемент в качестве параметра функции.
Таким образом, изначально документ last visible может быть пустым, а затем запрос сообщений и документ запроса last visible можно передать в качестве параметра для загрузки дополнительных сообщений и так далее.
Надеюсь, это поможет.