如何在React中通过表道具进行映射

Question

我在React中有一个表，它的行没有html元素，所以我可以用通常的方式进行映射。它的数据通过道具。下面是一个例子：

<Table
data={{head:{},data:[
{
data_creare:"20.01.2020",
detalii:"React example"
}
]}}
/>

我想做一些像

[this.state.message.map((list)=> {data_creare:list.a, detalii:list.b}]

import React, { useState } from 'react';
import Table from 'react-responsive-data-table';
import axios from 'axios';






 class ListaMesaje3 extends React.Component {

 componentDidMount() {
 axios.get(`http://11111111:111111/listamesaje`)
.then(res => {
  const persons = res.data;
  console.log(persons.mesaje);
  this.setState({mesajex:persons.mesaje});
  console.log(this.state.mesajex);


 
})
}

constructor(props) {
  super(props);
  this.state = {
      titlu: 'Lista mesaje',
      mesajex:[],
      x:[]
     
  }
}

render() {



  
  return(
  <div id="tot">
  <h3>{this.state.titlu}</h3>

 <Table style={{
opacity: 0.8,
backgroundColor: "#00113a",
color: "#ffffff",
textAlign: "center"

  },
  data:[
  {
    data_creare:"",
    detalii:""
  }
 ]



 }} />



 </div>
  );
 }

 }

export default ListaMesaje3;

Answer 1

首先需要提供一个head作为表头，然后根据head提供表体行作为对象。

<Table 
    data={
        {
            head:{
                data_creare:"Data Created",
                details:"Description"
            },
            data:[
                {
                    data_creare:"20.01.2020",
                    details:"React example"
                }
            ]
        }
    }/>