react中創建組件以及使用

組件基本使用
import React, { Component } from 'react'; // 在組件頭部引用

class Home extends Component { // 創建類
 
render(){ // 將頁面通過return返回給調用者  必須有一個根節點包裹 同vue的使用
    return(
        <div>
         <h3>組件中的節點要被一個根節點包裹起來</h3>
        </div>
    )
}

}
export  default Home 將該組件暴露出去


在需要調用的地方import Home from '/path'
直接在父組件中使用Home標簽即可

另一種定義子組件的方式

import React from 'react'
class New extends React.Component{
    constructor(props) {
        super(props) //用於父子組件傳值      類下面的構造器是必寫的，可用於改變this的指向
        this.state = {
            user : '張三'
        }
}
render() {
        return (
            <div class="root">
                <h2>{this.state.user}</h2>  // 數據綁定
                <h3>這是newd的跟節點</h3>
            </div>
        )
}

}
export default New