//
例如伪代码
infoList: [{
"
title
":
"
panel_1
",
"
context
":
"
this is panel_1
"
},
{
"
title
":
"
panel_2
",
"
context
":
"
this is panel_2
"
}
]
render() {
let
infoList
=
this
.
state
.
infoList;
return (
<
div
>
//根据infoList的长度动态渲染子组件,并且将infoList[i]的信息传入子组件显示
{
infoList
.
map
((
item
,
index
)
=>
{
return
<
PanelInfo
key
=
{
index
}
panelDetail
=
{
item
}
/>
})
}
</
div
>
);
}
render(){
let
list
= []
if(
this
.
state
.
infoList
.
length
>
0){
this
.
state
.
infolist
.
map((
item)
=>{
list
.push(
<
p
key
=
{
item
.
key
}
>
{
item
.
content
}
<
p
>)
})
}
return (
<
div
>
{
list
}
</
div
>
)
}