目录
- table实现滚动加载数据
- 实现效果
最近产品设计原型的时候,突然迷恋上了滚动加载数据,在强烈抗争下无果,只能动点歪脑筋实现这个效果,如果觉得不合适,请勿喷,新手小开发
实现效果
ant 的表格是无法没有api支持滚动加载的,当然那我首选考虑的就是给表格一个高度,然后去监听,但是我发现一个问题,F12的时候,它的高度一会高一会低了..那么监听行不通,只能另找出路了,比较困难总比办法多,没有困难也要制造困难😢
ant中,list的api,有一个叫做滚动加载,当我看到这个api的时候,我想到了element的InfiniteScroll 无限滚动
基于list进行二次封装?我的脑海中顿时浮现了这个想法,经尝试,发现好像是可以的,下面上代码(好像有一丢丢的小问题,当然问题不大...)
这里为什么写了另外一个table呢,是因为我发现,他能实现滚动,但是他的表头没法固定住,我尝试用样式去固定,o(╥﹏╥)o,可能是我太菜,没成功,那只能想办法,再去写一个表格,然后通过定位去定位到表头的那个未知.这里需要注意的是,需要给第一个表格的内容隐藏,第二个的表格表头隐藏,所以这里用到了showHeader这个属性,跟深度调整样式的方法 ....
当然最重要的一点是,能实现,但是这个滚动请求数据怎么办呢? 我参考了之前写uniapp的时候的方法
这里这个if(value)纯粹是因为我这个表格数据,他分俩接口给我┭┮﹏┭┮,所以我只能这样去判断一下...如果你们要用的话,可以根据自己的逻辑去写
总的来说就是这样了,勉强实现...真是没办法,刚入行一年多,能实现我就很开心了...如果能对大家有帮助,那是更好了
