callstack / callstack/react-native-pager-view
Delay/Flicker in View when setting State in onPageSelected
- 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
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