关于hooks

1.useState

        函数组件使用状态就需要这个钩子。

        useState用法是需要传入一个参数作为状态的初始值，当函数执行完后会返回两个值，一个是当前状态的属性，一个是修改状态的方法。

        原理：我们写一个useState方法，会返回当前状态的属性和设置状态的方法，每当状态改变之后，方法中会调用刷新视图的render方法。解决多个useState同时使用的问题，当多个状态存在的时候，我们需要使用数组保存状态。

2.useEffect

        它可以让你在函数中执行副作用操作。

        副作用：数据获取，数据订阅，以及手动更改react组件中的dom都属于副作用。因为渲染出来页面都是静态的，任何在其他之后的操作都会对它产生影响，所以称为副作用。

        useEffect第二个参数

        第一个参数：是一个函数，这个函数目的是告诉React组件，需要在渲染后执行哪些操作，这个函数会在DOM更新后被调用，useEffect默认在每次渲染后都调用，但也可以手动控制它的执行。

        第二个参数：是一个数组，当数组中任意一项变化的时候，useEffect会被重新执行。如果传入一个空数组，就是告诉useEffect不依赖于state，props中的任意值，useEffect就只会执行一次。

当数组有一个值的时候，就看这个值是否发生变化，发生变化后useEffect才会重新执行。

3.useContext

        React 的 Context API 是一种在应用程序中深入传递数据的方法，而无需手动一个一个在多个父子孙之间传递 prop。当咱们需要的只是传递数据时，它可以作为像Redux这样的工具的一个很好的替代。

4.useReducer

        const [state, dispatch] = useReducer(    
                           reducer,    
                           initialArg,    
                           init    
                   )

        useState的代替方案，它接收一个形如 (state, action) => newState 的 reducer，并返回当前的 state 以及与其配套的 dispatch 方法。

在某些场景下，useReducer 会比 useState 更适用，例如 state 逻辑较复杂且包含多个子值，或者下一个 state 依赖于之前的 state 等。并且，使用 useReducer 还能给那些会触发深更新的组件做性能优化，因为你可以向子组件传递 dispatch 而不是回调函数 。