callstack / callstack/react-native-pager-view
Delay/Flicker in View when setting State in onPageSelected
- Lenguaje dominante
- TypeScript
- Estrellas
- 3.4k
- Forks
- 476
- Merge medio
- 10 d 21 h
- PR fusionados (30 d)
- 2
Descripción
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?
Guía de contribución
Línea de trabajo
Comienza con el callback onPageSelected de PagerView y el setIndex useState mostrados en el ejemplo del issue. Reproduce el retraso al cambiar de página y, después, inspecciona el comportamiento de ref y de los eventos para determinar si se puede obtener la página activa actual sin renderizar actualizaciones de estado. Se considera terminado cuando se documente o implemente una forma compatible de actualizar los estilos de los botones de la página activa sin el parpadeo informado.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- react-native
- Área
- mobile
- Tipo de issue
- Error
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Estado de actividad
- Estancado
- Claridad
- Necesita aclaración
- Aptitud para principiantes
- 35/100