Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

402
Vistas
React Native: una tabla de datos simple en una FlastList, ¿cómo obtener una tabla de datos única para cada elemento?

Busco mis datos json, quiero mostrarlos con una tabla de datos. El problema es que mi componente FlatList crea una nueva tabla de datos para cada elemento, pero quiero una DataTable para todos mis elementos.

No encontré como solucionarlo. Comparto todo el código aquí. Usted me podría ayudar por favor ? Gracias

 import React, { Component } from 'react'; import { StyleSheet, Text, View, FlatList, Dimensions, ActivityIndicator } from 'react-native'; import { DataTable } from 'react-native-paper'; export default class Bien extends Component { constructor(props) { super(props); this.state = { data: [], isLoading: true }; } async getAll() { try { const response = await fetch('myJsonData'); const json = await response.json(); this.setState({ data: json.table }); } catch (error) { console.log(error); } finally { this.setState({ isLoading: false }); } } componentDidMount() { this.getAll(); } renderItem = ({ item, index }) => { return ( <View> <DataTable> <DataTable.Header> <DataTable.Title>Type</DataTable.Title> <DataTable.Title>Ville</DataTable.Title> <DataTable.Title numeric>Prix</DataTable.Title> </DataTable.Header> <DataTable.Row> <DataTable.Cell>{item.Category}</DataTable.Cell> <DataTable.Cell>{item.Ville}</DataTable.Cell> <DataTable.Cell numeric>{item.Prix}</DataTable.Cell> </DataTable.Row> </DataTable> </View> ); }; render() { const { data, isLoading } = this.state; return ( <FlatList data={data} renderItem={this.renderItem} /> ); } };
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Su FlatList está recorriendo cada elemento y creando una DataTable. En su lugar, puede envolver los elementos Data.Row dentro de una FlatList.

 <DataTable> <DataTable.Header> <DataTable.Title>Dessert</DataTable.Title> <DataTable.Title numeric>Calories</DataTable.Title> <DataTable.Title numeric>Fat</DataTable.Title> </DataTable.Header> <FlatList data={data} renderItem={_renderItem} /> </DataTable>

Ejemplo de trabajo completo: https://snack.expo.dev/@tnr_c/scrollable-datatable

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda