[英]how to loop for display complicate array value : Reactjs
I will create loop for display array value in return state. 我将为返回状态的显示数组值创建循环。 Now I display by {text.nameSub[0].nameSub[0][0].nameSub},{text.nameSub[0].nameSub[0][1].nameSub} but I don't know create for loop instead this code. 现在,我按{text.nameSub [0] .nameSub [0] [0] .nameSub},{text.nameSub [0] .nameSub [0] [1] .nameSub}显示,但我不知道create for循环而是这段代码。 Help me please, Thank you so much for suggest. 请帮助我,非常感谢您的建议。
import React,{Component} from 'react'
import '../App.css'
class addEntity extends Component {
constructor(props){
super(props);
this.state ={
index: 1,
entity: []
}
}
render() {
return(
<div>
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Entity Type</th>
<th scope="col">Sub-type</th>
<th scope="col">Actions</th>
</tr>
</thead>
{this.state.entity.map((text,index) =>{
return(
<tr key={text.nameEn}>
<th>{index+1}</th>
<td scope="col">{text.nameEn}</td>
<td scope="col">
{text.nameSub[0].nameSub[0][0].nameSub},
{text.nameSub[0].nameSub[0][1].nameSub}
{/* I will create loop for display it here like this {text.nameSub[0].nameSub[0][i].nameSub} */}
</td>
</tr>
)
})}
</table>
</div>
)
}
}
export default addEntity;
You can iterate like this, 你可以这样迭代
{this.state.entity.map((text,index) =>{
return(
<tr key={text.nameEn}>
<th>{index+1}</th> //this might be `td` and not `th`
<td scope="col">{text.nameEn}</td>
<td scope="col">
{text.nameSub[index].map((name,ind) => {
return <span>{name[ind].nameSub}</span>
})}
</td>
</tr>
)
})}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.