callstack / callstack/react-native-pager-view
Delay/Flicker in View when setting State in onPageSelected
- Lingua principale
- TypeScript
- Stelle
- 3.4k
- Fork
- 476
- Merge medio
- 10g 21h
- PR unite (30g)
- 2
Descrizione
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?
Guida per i contributori
Apri la guida per i contributori
Direzione di ricerca
Inizia con il callback onPageSelected di PagerView e il setIndex useState mostrati nell’esempio dell’issue. Riproduci il ritardo quando cambi pagina, quindi esamina il comportamento di ref e degli eventi per determinare se sia possibile ottenere la pagina attiva corrente senza eseguire il rendering degli aggiornamenti dello stato. Il lavoro è completo quando viene documentato o implementato un modo supportato per aggiornare gli stili dei pulsanti della pagina attiva senza il flicker segnalato.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- react-native
- Ambito
- mobile
- Tipo di issue
- Bug
- Difficoltà
- 3/5
- Tempo stimato
- 1-2 giorni
- Stato di attività
- Ferma
- Chiarezza
- Da chiarire
- Idoneità per principianti
- 35/100