Reactjs 在数据表组件中显示数据库中的数据

我使用了一个数据表组件。在其中，我希望每个对象有一行

return (
           

         <Table striped bordered hover variant="dark">
  <thead>
    <tr>
  
      <th>Nom</th>
      <th>Adresse</th>
 
   
    </tr>
  </thead>
  <tbody>
    <tr>
    
      
      <td>{this.props.obj.nom}</td>
        <td>{this.props.obj.adresse}</td>
   
    
      
    </tr>
 
  </tbody>
</Table> 

        );

返回(
笔名
阿迪斯
{this.props.obj.nom}
{this.props.obj.adrese}
);

我的obj设置了这两个功能：

  getEntreprise = () => {
   axios.get('http://localhost:8080/api/ent')
            .then(res => {
                this.setState({ liste: res.data });
                console.log(res.data);
                console.log('Data récupérée1 !');
            })
            .catch(function (error) {
                console.log(error);
            })
  }

  dataTable() {
        return this.state.liste.map((data,i) => {
            return <DataTable obj={data}  key={i}/>;
        });
    }

getEnterprise=（）=>{
axios.get（）http://localhost:8080/api/ent')
。然后（res=>{
this.setState（{liste:res.data}）；
console.log（res.data）；
log（'datarécupérée1！'）；
})
.catch（函数（错误）{
console.log（错误）；
})
}
数据表（）{
返回此.state.liste.map（（数据，i）=>{
返回；
});
}

---

我不明白为什么它会为每个项目生成一个组件，而不是为每个项目生成一个表行

这里您为数组列表中的每个映射项目映射一个新表。因此，只需在单个表标记内映射表行标记

   getEntreprise = () => {
   axios.get('http://localhost:8080/api/ent')
            .then(res => {
                this.setState({ liste: res.data });
                console.log(res.data);
                console.log('Data récupérée1 !');
            })
            .catch(function (error) {
                console.log(error);
            })
  }

  dataTable() {
        return (
  <Table striped bordered hover variant="dark">
  <thead>
    <tr>
  
      <th>Nom</th>
      <th>Adresse</th>
 
   
    </tr>
  </thead>
  <tbody>
{
this.state.liste.map((data,i) => (
            <DataTable obj={data}  key={i}/>;
        ));
}
    
  </tbody>
</Table> 
)}

getEnterprise=（）=>{
axios.get（）http://localhost:8080/api/ent')
。然后（res=>{
this.setState（{liste:res.data}）；
console.log（res.data）；
log（'datarécupérée1！'）；
})
.catch（函数（错误）{
console.log（错误）；
})
}
数据表（）{
返回(
笔名
阿迪斯
{
this.state.liste.map（（数据，i）=>(
;
));
}
)}

并按如下方式更改DataTable组件

return (
    <tr>
      <td>{this.props.obj.nom}</td>
        <td>{this.props.obj.adresse}</td>
    </tr>
 
        );

返回(
{this.props.obj.nom}
{this.props.obj.adrese}
);