React Hooks

React Hook是FaceBook的React小组2018年底推出。2019年React Hooks是React生态圈里边最火的新特性了。它改变了原始的React类的开发方式，改用了函数形式;它改变了复杂的状态操作形式，让程序员用起来更轻松;它改变了一个状态组件的复用性，让组件的复用性大大增加。

React Hooks 与原始编写形式对比

原始class写法：

import React, { Component } from 'react';

class Time extends Component {
    constructor(props) {
        super(props);
        this.state = { 
            time:0 
        }
    }
    render() { 
        return (
            <div>
                <p>You click {this.state.time} times</p>
                <button onClick={this.addTime.bind(this)}>Click me</button>
            </div>
        );
    }
    addTime(){
        this.setState({time:this.state.time+1})
    }
}
 
export default Time;

React Hooks 新特性写法：

import React, { useState } from 'react';
function Time(){
    const [ time , setTime ] = useState(0);
    return (
        <div>
            <p>You clicked {time} times</p>
            <button onClick={()=>{setTime(time+1)}}>click me</button>
        </div>
    )
}
export default Time;

从上面可以看出React Hooks就是不需要用class直接用function就可以。