React实时显示当前时间

XiaofeiStor

已于 2023-02-03 17:15:44 修改

阅读量2.6k

点赞数 1

分类专栏： TypeScript React AntDesign 文章标签： react.js 前端 javascript

于 2023-02-03 17:04:42 首次发布

本文链接：https://blog.csdn.net/LiYinger1/article/details/128871498

版权

React 同时被 3 个专栏收录

7 篇文章

订阅专栏

TypeScript

6 篇文章

订阅专栏

AntDesign

3 篇文章

订阅专栏

该代码示例展示了一个使用ReactHooks创建的时间组件，它每秒更新一次显示的日期和时间，并且在组件卸载时清除定时器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

const TimeComponent：React.FC()=>{
    const [timer,setTimer] = useState<any>('')  
    const [refresh,setRefresh] = useState<number>(0)    

    useEffect(()=>{
        const timeoutId = setTimeout(()=>{
            setRefresh((r)=>r +1);
            setTimer(momemt(new Date().getTime()).format('YYYY年MM月DD日 HH时mm分ss秒'))
`        },1000)

        return()=>{
            clearTimeout(timeoutId)
        }
    },[refresh])


  return (
        <>
            {timer}
        </>
    )

}

效果图