appbaseio / appbaseio/reactivesearch

Vue - AutoScrollTop on pagination not working and pageChange event not emitted

Offen
#1,973 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
bug
Vorherrschende Sprache
JavaScript
Sterne
4.9k
Forks
477
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

**Affected Projects**
Vue.JS

**Library Version:**
1.29.0

**Describe the bug**

When clicking on a page number, the ReactiveList component should scroll to top (by default) and should send a pageChange event.
In my case, the scroll is not done and I never get the pageChange event.

I think I found the problem in the code of the /packages/vue/src/components/result/ReactiveList.jsx component:

```
hits(newVal, oldVal) {
this.$emit('data', this.getData());
if (this.shouldRenderPagination) {
// called when page is changed
if (this.isLoading && (oldVal || newVal)) {
if (this.hasPageChangeListener) {
this.$emit('pageChange', this.currentPageState + 1, this.totalPages);
this.$emit('page-change', this.currentPageState + 1, this.totalPages);
} else if (this.scrollOnChange) {
window.scrollTo(0, 0);
}
}

```
I can be wrong but I think that the line
`if (this.isLoading && (oldVal || newVal)) {`

should be

`if (!this.isLoading && (oldVal || newVal)) {`

It's missing a NOT before this.isLoading. Else it will never execute the code that is following the condition because the loading is finished since a while at this time.

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne in packages/vue/src/components/result/ReactiveList.jsx und untersuche den hits-Watcher und seine Ladebedingung. Reproduziere die Paginierung mit ReactiveList und überprüfe anschließend, dass ein Seitenwechsel standardmäßig nach oben scrollt und das pageChange-Ereignis auslöst.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Aktivitätsstatus
Veraltet
Klarheit
Klar beschrieben
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.