其他分享
首页 > 其他分享> > react实现获取当前时间

react实现获取当前时间

作者:互联网

获取当前时间

 <div id="app"></div>
    <script type="text/babel">
        //获取时间
        class Demo extends React.Component{
            constructor(){
                super()
                this.state={
                    //时间对象
                   time:new Date()
                }
                this.timer=null//定义计时器
            }
            //更新事件
            updateTime(){
                this.setState({
                    time:new Date()
                })
            }
            //组件一旦挂载就调用
            componentDidMount(){
                this.timer= setInterval(() => {
                    this.updateTime()
                }, 100);
            }
            //组件将要卸载之前清楚定时器
            componentWillUnmount(){
                clearInterval(timer)
            }
            render(){
                return <div>
                        <h3>{this.state.time.toLocaleDateString()}-{this.state.time.toLocaleTimeString()}</h3>
                    </div>
            }
        }
        ReactDOM.render(<Demo/>,document.getElementById("app"))
    </script>

 

标签:updateTime,render,timer,react,获取,state,当前,time,Date
来源: https://www.cnblogs.com/keyeking/p/15611043.html