callstack / callstack/react-native-pager-view

Delay/Flicker in View when setting State in onPageSelected

Offen
#766 3 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen
question
Vorherrschende Sprache
TypeScript
Sterne
3.4k
Forks
476
Ø Merge
10 T. 21 Std.
Gemergte PRs (30 T.)
2

Beschreibung

I've created a PagerView with an onPageSelected callback:

```
const [index, setIndex] = useState(0);
```

```


First page


Second page


```

```
const onPageSelected = (event) => {
const {position} = event.nativeEvent;
if(position !== index) {
setIndex(position);
}
}
```

When i change view, there is a small delay. I've traced it back to the `setIndex()` useState.
I want to use the index to show different button styles based on if it is the active view or not.

How do i get around this?
When i remove the setIndex(), its super smooth, but I dont have access to the current active page.
Can i get the current active page from the ref? Is there a better way to implement this?

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit dem PagerView onPageSelected callback und dem im Issue-Beispiel gezeigten setIndex useState. Reproduziere die Verzögerung beim Wechseln der Seiten und untersuche dann das ref- und Event-Verhalten, um festzustellen, ob die aktuell aktive Seite ohne Rendering von State-Updates ermittelt werden kann. Als erledigt gilt die Dokumentation oder Implementierung einer unterstützten Möglichkeit, die Button-Stile der aktiven Seite ohne das gemeldete Flackern zu aktualisieren.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react-native
Bereich
mobile
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Muss geklärt werden
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

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