1.定义时间顺序

 const timmer = useRef()
    const [Hour, setHour] = useState('');
    const [Seconds, setSeconds] = useState('');
    const [Minutes, setMinutes] = useState('');
    const [Year, setYear] = useState('');
    const [Month, setMonth] = useState('');
    const [Day, setDay] = useState('');

2.获取当前时间进行模板处理

 const getNewDate = () => {
        const time = new Date();
        const year = time.getFullYear();
        const month = time.getMonth() + 1;
        const day = time.getDate();
        const wday = time.getDay()
        const hour = time.getHours();
        const minutes = time.getMinutes();
        const s = time.getSeconds();
        const seconds = s <= 9 ? "0" + s : s;
        setHour(hour)
        setSeconds(seconds)
        if (minutes < 10) {
            setMinutes(`0${minutes}`)
        } else {
            setMinutes(minutes)
        }
        setYear(year)
        setMonth(month)
        setDay(day)
    }

3.render渲染

<div ref={timmer}>{Year}-{Month}-{Day} {Hour}:{Minutes}:{Seconds}</div>

4.时隔一秒调用一次

    useEffect(() => {
        timmer.current = setInterval(getNewDate, 1000);

        return () => {
            clearTimeout(timmer.current)
        }
    }, [])