React中文网中有一个用class写就的时钟例子https://react.docschina.org/docs/state-and-lifecycle.html,
现在React又推出了新的hook api,便顺手用hook改写了一下这个例子:
import React, { useState, useEffect} from ‘react‘; import ReactDOM from ‘react-dom‘; function Clock(){ const [date,setDate]=useState(new Date()); useEffect(()=>{ function tick(){ setDate(new Date()); } const timerID = setInterval(tick,1000); return function clearTick(){ clearInterval(timerID); }; }); return( <div> <h1>Hello, world!</h1> <h2>It is {date.toLocaleTimeString()}.</h2> </div> ); } ReactDOM.render( <Clock/>, document.getElementById(‘root‘) );
[react]使用hook改写的一个react class 时钟例子
原文:https://www.cnblogs.com/sx00xs/p/11756421.html