2 react資料渲染
阿新 • • 發佈:2018-12-24
1 集合(使用map)
#父元件 class App extends Component { render() { const user={ name:"heloo", hobbies:["sport","read"] } return ( <div className="App"> <Header></Header> <Home name={'zhangsan'} age={12} user={user}></Home> </div> ); } }
#子元件 export default class Home extends Component{ render() { return ( <div> <h1>Home</h1> <div>{this.props.name}</div> <ul> {this.props.user.hobbies.map((hobby,i) => <li key={i}>{hobby}</li>)} </ul> </div> ); } }
注意:key是必須要的,不然程式會報錯