Привет, у меня реализован scroll-laoder и когда я перехожу на страницу и скроллю все подгружается правильно, но когда делаю одну из этих операций: create, update, delete, то страница перезагружается и я имею первую страницу c лимитом элеметов, но новые страницы с элементами не подгружаються, а запрос на сервер идет и я получаю ответ с новыми элементами и страницами, но на клиенте новые элементы не подгружаються, запросы на сервер идут до тех пор, пока сервер не отдает ошибку, о большом количестве запросов на эндпоинт. Подскажите пожалуйста, как решить эту проблему?
кверя получения юзеров
apollo: {
users: {
query: gql`query users($input: ReadUsersInput){
users(input: $input){
pageInfo {
start
total
pageLength
limit
}
users {
id
email
lastName
firstName
groups
connection
}
}
}`,
variables: {
input: {
page: {
page: 0,
limit: 10
}
}
},
update(data) {
return data.users
}
}
}
темплейт:
<div
class="user-mgmt-info"
v-if="rowCount > 0">
1-{{ rowCount }} of {{ totalUsersCount }}
</div>
<scroll-loader
:loader-method="fetchMore"
:loader-disable="isLoadMoreDisabled"
:loader-size="40">
</scroll-loader>
смотрю за изменениями в масиве юзеров:
isLoadMoreDisabled() {
return this.totalUsersCount === 0 || this.rowCount >= this.totalUsersCount
}
watch: {
users() {
if (!this.isLoadMoreDisabled && !this.awaitingChanges) {
this.fetchMore()
}
},
},
метод получения новых страниц с юезрами:
fetchMore(){
if (!this.isLoadMoreDisabled) {
this.$apollo.queries.users.fetchMore({
variables: {
input: {
page: {
page: this.currentPage += 1,
limit: 10
}
}
},
updateQuery(previousResult, { fetchMoreResult }) {
// eslint-disable-next-line
const users = [
...previousResult.users.users,
...fetchMoreResult.users.users
]
const pageInfo = fetchMoreResult.users.pageInfo
return {
users: {
users,
pageInfo,
__typename: "users"
}
}
}
})
}
}