组件嵌套
- 内层组件使用外部组件的数据
- 注意组件的拆分,分析数据的传入类型
// 定义外部组件
class App extends React.Component{
render(){
let arr = this.props.arr;
return(
<div>
{
arr.map((item,index)=>{
return <Welcome key={index} arr={item} />
})
}
</div>
)
}
}
// 定义内部组件
function Welcome(props) {
return <h1>Welcome {props.arr}</h1>
}
// 定义数据
let arr = ["张三","李四","王五"];
// 渲染
ReactDOM.render(<App arr={arr} />,document.getElementById("example") )