自定义React Hooks（超时）：useTimeout

使用useTimeout Hook，我们可以使用声明式方法来实现setTimeout。

创建一个带有回调callback和延迟的Hook。
使用useRef为callback创建一个ref。
两次使用useEffect。一次用于记住最后一个回调，一次用于设置超时和清除。

示例：

const useTimeout = (callback, delay) => {
    const savedCallback = React.useRef();
    React.useEffect(() => {
        function tick() {
            savedCallback.current();
        }
        if(delay != null) {
            let id = setTimeout(tick, delay);
            return () => clearTimeout(id); 
        }
    },[delay])
}

使用示例：

const ExampleTimerFiveSeconds = props => {
    const [seconds, setSeconds] = React.useState(0);
    useTimeout(() => {
        setSeconds(seconds+1);
    }, 5000);
    return <p>{seconds}</p>
}
ReactDOM.render(<ExampleTimerFiveSeconds />, document.getElementById("root"));