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