1、hooks组件中清除定时器
let timer: any = null;
timer = setInterval(() => {
//todo
}, 1000);
clearInterval(timer);
此时是无法清除定时器的。 我们打印timer查找原因，此时timer是为null，那么可以确定timer并没有被赋值，或因为赋值后被re-render了， 因此无法获取到timer的值。
废话说完，我们来说解决办法：使用useRef来解决这个问题
const timer = useRef<any>(null);
timer = setInterval(() => {
//todo
}, 1000);
clearInterval(timer);
分析：
1、useRef 返回的是一个可变的对象，该对象只有个current属性，初始值为传入的参数（initialValue）;
2、返回的ref对象在组件的整个生命周期内保持不变；
3、当更新current值时，并不会re-render(重新渲染)，这是与useState不同的地方；
4、更新useRef是side effect(副作用)，所以一般写在useEffect或event handler里；
5、useRef类似于组件的this；
扩展：
如果我们定义的变量是不需要重新渲染页面的，可以使用useRef来操作，如果需要重新渲染页面的，还是使用useState来操作变量并重新渲染页面。
