简单聊聊函数组件

创建方式：

const Hello = (props) => {
    return <div>{props.message}</div>
}
或者
function Hello(props) {
    return <div>{props.message}</div>
}

函数组件好处都有啥？

• 比class简洁
• 没有生命周期
• 没有state
• 没有this

函数组件代替class组件

• 面临两个问题

1. 没有state
2. 没有生命周期

• 没有State

　　在ReactV16.8.0中推出Hooks API，使用API中的 useState 就可以解决问题

• 没有生命周期

　　使用Hooks API中的 useEffect 就可以解决问题

useEffect

• 模拟 componentDidmount 

useEffect(()=>{ console.log('渲染一次') },[] ) 在后面加一个空数组即可

• 模拟 componentDidUpdate 

useEffect(()=>{console.log('任意属性变更')}) 
或者
useEffect(()=>{console.log('n变了')},[n])

• 模拟 componentWillUnmount

useEffect(() => {
    console.log(' ')
    return () => {
        console.log(' ')
    }
})