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

166
Vistas
How to push dynamic columns and row data to antd table

enter image description here

The below code is not accepting for an array of rows and columns

Here is antd example:

const data = [];
for (let i = 0; i < 4; i++) {
  data.push({
    key: i,
    name: `Edward King ${i}`,
    age: 32
    //  address: `London, Park Lane no. ${i}`
  });
}

Tried same logic in below: 
// columns :datacloumns1
// rows :rowdata

const data = [];
for (let i = 0; i < 4; i++) {
   for (var j = 0; j < reportDataRows?.length; j++){
  data.push({
  datacloumns1[i]:rowdata[i] // here i am binding row to the exact column but this is not accepting
  });
}
}
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Thank you for your suggestions.

Here is the solution: have changed my result to title and dataIndex format, so I realized that antd table accepts only the title and dataIndex format.

let datacloumns = reportDataRows && Object.keys(reportDataRows[0])?.map((key) => (
    <span >{cloumns.push({
        title: key, dataIndex: key,
        //defaultSortOrder: 'descend',
        sorter: true
    })}
    </span>))

< Table 
  rowClassName = {(record, index) => index % 2 === 0 ? 'table-row-light' : 'table-row-dark'} 
  size = { 'default'} 
  columns = { cloumns } 
  bordered = { true} 
  sortDirections = { ['ascend', 'descend'] } 
  loading = { reportDataRows === undefined ? true : false} 
  pagination = {{ pageSize: 10 }} dataSource = { reportDataRows === undefined ? [] : reportDataRows} 
/>
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