在react中使用定时器

本文探讨了定时器在支付订单倒计时、前端时钟显示及轮询接口中的应用,深入解析了React组件生命周期中定时器的设置与清除方法。同时,介绍了antd table组件在数据加载时的loading状态控制,以及对象解构赋值的灵活运用。最后,讨论了分页、下拉刷新和上拉加载更多的实现原理。

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

定时器的应用场景:

  1. 支付订单的倒计时
  2. 前端的时钟
  3. 轮训接口

这里涉及到了lifecycle的使用

在这里插入图片描述

 componentDidMount()
    {
        this.timerID = setInterval(
            () => this.tick(),
            1000
        );
    }

    componentWillUnmount(){
        clearInterval(this.timerID)
    }

setInterval
setTimeout


antd table的使用

当我去获取服务端的数据的时候,table.loading = true, 获取完毕, table=loading =flase

解构对象:默认情况需要变量名和属性名相同,当然也可以按照下面的方法进行处理

可以从一个对象中提取变量并赋值给和对象属性名不同的新的变量名。

var o = {p: 42, q: true};
var {p: foo, q: bar} = o;
 
console.log(foo); // 42 
console.log(bar); // true

分页

表格的分页

列表的分页
下拉刷新: 其实我们所关心的是下拉刷新的原理是什么?
本质上也是对于事件的监听

上拉加载更多

服务端有没有totalCount字段对前端的影响

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值