1. import useConutDonw from './useCountDown';
    3. function App() {
    4.   const countDown = useCountDown(1648836799000);
    5.   const [[monthes, days, hours, minutes, seconds], setCountDown] = React.useState([0, 0, 0, 0, 0])l
    6.   React.useEffect(() => {
    7.     setCountDown(countDown);
    8.   }, [countDown])
    11.   return (
    12.     <div>
    13.       {
    14.         `${monthes}个月${days}天 ${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`
    15.       }
    16.     </div>
    17.   )
    18. }
    1. function useCountDown (timeStamp) {
    2.   const [countDown, setCountDown] = React.useState([0, 0, 0, 0, 0]);
    3.   let t = null;
    5.   function doCountDown () {
    6.     const nowTimeStamp = new Date().getTime(),
    7.           diffTimeStamp = timeStamp - nowTimeStamp,
    8.           diffDate = new Date(diffTimeStamp),
    9.           diffMonths = diffDate.getMonth(),
    10.           diffDays = diffDate.getDate(),
    11.           diffHours = diffDate.getHours(),
    12.           diffMinutes = diffDate.getMinutes(),
    13.           diffSeconds = diffDate.getSeconds();
    15.     setCountDown([
    16.       diffMonths,
    17.       diffDays,
    18.       diffHours,
    19.       diffMinutes,
    20.       diffSeconds,
    21.     ]);
    23.     if (diffMonths === 0 && diffDays === 0 && diffHours === 0 && diffMinutes === 0 && diffSeconds === 0) {
    24.       clearInterval(t);
    25.       t = null;
    26.       return;
    27.     }
    29.     React.useEffect({} => {
    30.       t = setInterval(doCountDown, 1000);
    31.     }, []);
    33.     return countDown;
    34.   }
    35. }
    36. export default useCountDown;