react创建组件的方式

react创建组件的方式:

（１）工厂（无状态）函数（最简洁，推荐使用）

function Component() {
    return<h1>工厂（无状态）函数（最简洁，推荐使用）</h1>
}

（２）ES6语法，（复杂组件，推荐使用）

//定义的组件类Component必须继承React的核心组件类Component,extends是继承的意思，render()方法是react最常用的方法
class Component extends Component{
render(){
return <h2>ES6语法，（复杂组件，推荐使用）</h2>
 }
}

共同点：在这两种方法中，return的都是虚拟DOＭ对象集合.

还有es5的老语法来创建组件，不过已经不推荐使用，在这里就不再说了。

渲染组件标签：

ReactDOM.render(<Component1 />, document.getElementById('root'));

注意点：

（１）用class定义的组件类必须首字母大写

（２）虚拟DOM元素必须只有一个根元素

（３）虚拟DOM元素必须有结束标签

ReactDOM.render()渲染组件标签的基本流程：

（１）React内部会创建组件实例对象

（２）组件实例对象调用render()方法，返回（即return）虚拟DOM对象，ReactDOM.render()将虚拟DOM对象转化为真实DOM对象

（３）将真实DOM对象插入指定的页面元素内部