element中表格前端分页和后端分页分别用法,以及容易踩到的坑,坑,坑

前端分页:

前段时间因为项目上线紧急,后端没有做分页,只有前端去处理几万条的数据做了个分页处理,贴代码:

表格绑定一个变量:

表格内容这里还有个处理时间戳的问题,就是使用管道的方法,经常会遇到。

分页写法:

data里面申明的变量:

computed中计算数据:(如果后端分页也写这个,我当时就是傻逼了一下,为了省事,后端分页也这样直接复制之前的代码,导致自己给自己埋了个坑,猜猜是啥坑)

最后调接口赋值:

前端分页ok咯!

后端分页:

注意这里跟前端分页不一样哦!

computed里面就不用写啦,可以直接去调接口啦,因为不用去处理分页啦,这些事情都都丢给后端啦!

如果你非要按照前端分页那样写,computed里面直接加一句这个,不然当你点击第二页的时候,当前页就是2,放在slice((pageIndexList-1)*pageSizeList,pageIndexList*pageSizeList)这里面最后结果就是slice(10,20),既然后端给你做了分页,加入你一页显示20条,后端已经给你返回20条了,那你还截取啥10-20肯定就没有数据啦,此时此刻界面就会显示暂无数据,急死你,这就是前端提到的坑,还有别的好多坑我忘记了,下次想起来再写吧!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值