組件嵌套
- 內(nèi)層組件使用外部組件的數(shù)據(jù)
- 注意組件的拆分碧磅,分析數(shù)據(jù)的傳入類型
// 定義外部組件
class App extends React.Component{
render(){
let arr = this.props.arr;
return(
<div>
{
arr.map((item,index)=>{
return <Welcome key={index} arr={item} />
})
}
</div>
)
}
}
// 定義內(nèi)部組件
function Welcome(props) {
return <h1>Welcome {props.arr}</h1>
}
// 定義數(shù)據(jù)
let arr = ["張三","李四","王五"];
// 渲染
ReactDOM.render(<App arr={arr} />,document.getElementById("example") )