callstack / callstack/react-native-pager-view

Render PagerView inside a FlatList

Abierto
#619 1 comentario 3 reacciones 0 asignados Ver en GitHub
question
Lenguaje dominante
TypeScript
Estrellas
3.4k
Forks
476
Merge medio
10 d 21 h
PR fusionados (30 d)
2

Descripción

## Ask your Question
Hi, Thank you so much for the great lib!

I have a hard time rendering a PagerView as an item of a FlatList. PagerView just won't show.
It is working when I replace FlatList with a ScrollView. Would love to see a PagerView working inside a renderItem function.

Here is a simple repro :

```
import React from 'react';
import { SafeAreaView, View, FlatList, StyleSheet, Text, StatusBar } from 'react-native';
import PagerView from 'react-native-pager-view'

const DATA = [
{
id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba',
title: 'First Item',
},
{
id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63',
title: 'Second Item',
},
{
id: '58694a0f-3da1-471f-bd96-145571e29d72',
title: 'Third Item',
},
];

const Item = ({ title }) => (


{title}


{title}


);

const Test = () => {
const renderItem = ({ item }) => (

);

return (

item.id}
/>

);
}

const styles = StyleSheet.create({
container: {
flex: 1,
marginTop: StatusBar.currentHeight || 0,
},
item: {
backgroundColor: '#f9c2ff',
padding: 20,
marginVertical: 8,
marginHorizontal: 16,
},
title: {
fontSize: 32,
},
});

export default Test;
```

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Comienza ejecutando la reproducción proporcionada de React Native y comparando el comportamiento de PagerView dentro de FlatList con el caso de ScrollView descrito. Sigue la ruta de renderizado de PagerView y verifica que el pager se vuelva visible cuando se utiliza desde el renderItem de FlatList.

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
4/5
Tiempo estimado
3-5 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
25/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.