React第二弹——什么是React组件

提示：本人是自学前端的一枚小小程序媛，以下内容是自己总结的笔记，如有错误，欢迎大家批评指正！！！！

说到组件，想必大家并不会陌生，随着组件化开发思想的诞生，前端在开发时才会变得如次方便。所谓组件化开发，就是把一个个功能抽离出去成为单独的模块，需要的时候直接引入就可以，这样极大的提高了代码的复用性和灵活性。在React中，有两种组件，一个是函数组件，一个是类组件，我们先聊聊函数组件。

函数组件，顾名思义就是用函数创建的组件。举个栗子

import React from 'react'
import ReactDOM from 'react-dom'
function  Hello(){
return (<div>这是函数组件</div>)
}
ReactDOM.render(<Hello/>,document.getElementById(‘root’))

使用JS中的函数(箭头函数)创建的组件叫做函数组件。
函数组件必须有返回值，返回值就是组件的内容，即使组件没有内容，也要写return null。
还有组件的名称必须用大写字母开头，React据此来区分组件和普通的React元素。
最后直接使用函数名作为标签名，React会把他解析成一个组件。
另外还需要注意函数组件是无状态组件

注意：有状态组件和无状态组件下期讲解

类组件是通过JS中的类创建的组件，举个例子

import React from 'react'
import ReactDOM from 'react-dom'
class Hello extends React.Component{
    render(){
        return (
            <div>这是类组件</div>
        )
    }
}
ReactDOM.render(<Hello/>,document.getElementById('root'))