React学习回顾（第三节）

第三节 创建React组件

组件化开发是让让我们组件复用和便于维护。（代码是手打的代码单词可能写错，建议根据模板自己敲打）

//创建一个MyApp 组件
class MyApp extends React.Compoent{
    render(){
        return (
            <div>
                <h1>This is My first React compoent!!</h1>
                <h2>Hello React!!</h2>
            </div>
        )
    }
}
ReactDOM.render(<MyApp />,document.getElementById('app'));

上面代码我们就创建了一个简单得组件 这个组件也同时达到了服用得效果

let template = (    //组件必须有一个根组件
    <div>
        <MyApp />
        <MyApp />
        <MyApp />
    </div>
)
ReactDOM.render(template,document.getElementById('app'));

分析上面得代码

1. 创建一个MyApp的组件，并继承了React.Compoent 这个组件。
2. 里面有一个render方法，返回一个html 模板。
3. 将我们的模板直接放入到ReactDOM.render 中完成渲染。