时钟

简单电子钟

实时编辑器

function Clock(props) {
  const [date, setDate] = useState('');
  useEffect(() => {
     tick()
    const timerID = setInterval(() => tick(), 1000);

    return function cleanup() {
      clearInterval(timerID);
    };
  });

  function tick() {
    setDate(timeStamp2String());
  }
       function timeStamp2String(){
            // var datetime = new Date();
            // date.setTime(date);
            
            let datetime = new Date()
            let year = datetime.getFullYear();
            let month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
            let date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
            let hour = datetime.getHours()< 10 ? "0" + datetime.getHours() : datetime.getHours();
            let minute = datetime.getMinutes()< 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
            let second = datetime.getSeconds()< 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
            return year + "-" + month + "-" + date+" "+hour+":"+minute+":"+second;
        }
  return (
    <div>
      <h1> {date}   </h1>
    </div>
  );
}

结果

Loading...

转动表盘

实时编辑器

function Clock(){








    return <>
        <div >
         美化 时钟
        </div>
    </>
}

结果

Loading...