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') );