En mi proyecto está mostrando el error anterior.
ProductoContenedor.js:
import React, { useState, useEffect } from 'react' import { View, Text, StyleSheet, ActivityIndicator, FlatList } from 'react-native' import ProductList from './ProductList'; const data = require('../../assets/data/products.json'); const ProductContainer = () => { const [products, setProducts ] = useState([]); useEffect(() => { setProducts(data); return () => { setProducts([]) } }, []) return ( <View> <Text>Product Container</Text> <View style={{ marginTop: 100}}> <FlatList numColumns={2} horizontal data={products} renderItem={({item}) => <ProductList key={item.id} item={item}/>} keyExtractor={item => item.name} /> </View> </View> ) } export default ProductContainer;Los detalles del error:
This error is located at: in FlatList (created by ProductContainer) in RCTView (created by View) in View (created by ProductContainer) in RCTView (created by View) in View (created by ProductContainer) in ProductContainer (created by App) in RCTView (created by View) in View (created by App) in App (created by ExpoRoot) in ExpoRoot in RCTView (created by View) in View (created by AppContainer) in RCTView (created by View) in View (created by AppContainer) in AppContainerSi quieres puedo darte otros detalles también.
Gracias por adelantado
No puede tener una FlatList horizontal con varias columnas. Eso es lo que dice la documentación de React Native:
Las columnas múltiples solo se pueden representar con horizontal={false} y se zigzaguearán como un diseño flexWrap. Todos los elementos deben tener la misma altura; los diseños de mampostería no son compatibles.
Debe eliminar numColumns=2 si desea que su FlatList sea horizontal o establecer horizontal en falso si desea dos columnas.
<FlatList numColumns={2} horizontal={false} data={products} renderItem={({item}) => <ProductList key={item.id} item={item}/>} keyExtractor={item => item.name} />