callstack / callstack/react-native-pager-view

Delay/Flicker in View when setting State in onPageSelected

Ouverte
#766 3 commentaires 1 réaction 0 personnes assignées Voir sur GitHub
question
Langage dominant
TypeScript
Étoiles
3.4k
Forks
476
Merge moyen
10 j 21 h
PR mergées (30 j)
2

Description

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?

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par le callback onPageSelected de PagerView et le setIndex useState présentés dans l’exemple de l’issue. Reproduisez le délai lors du changement de page, puis examinez le comportement de ref et des événements afin de déterminer s’il est possible d’obtenir la page active actuelle sans effectuer le rendu des mises à jour de l’état. Le travail est terminé lorsqu’une méthode prise en charge pour mettre à jour les styles des boutons de la page active sans le scintillement signalé est documentée ou implémentée.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
react-native
Domaine
mobile
Type d'issue
Bug
Difficulté
3/5
Temps estimé
1-2 jours
Activité
À l'abandon
Clarté
À clarifier
Accessibilité débutants
35/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.