<el-table
:data="tableData"
stripe
class="swiper-page-table"
ref="table"
height="100%"
>
<el-table-column type="index" label="序号" width="50"> </el-table-column>
<el-table-column prop="date" label="时间" width="120">
</el-table-column>
<el-table-column prop="name" label="姓名" width="140">
</el-table-column>
<el-table-column prop="address" label="地址" min-width="220">
</el-table-column>
</el-table> mounted() {
this.tableScroll()
}, methods: {
tableScroll(){
const table = this.$refs.table;
// 拿到表格中承载数据的div元素
const divData = table.bodyWrapper;
// 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素)
setInterval(() => {
// 元素自增距离顶部1像素
divData.scrollTop += 1;
// 判断元素是否滚动到底部(可视高度+距离顶部=整个高度)
if (divData.clientHeight + divData.scrollTop == divData.scrollHeight) {
// 重置table距离顶部距离
divData.scrollTop = 0;
}
}, 30); // 滚动速度
}
} <style lang="scss" scoped>
.app-container {
// 去除滚动的滚动条
::v-deep .el-table--scrollable-y .el-table__body-wrapper{
overflow-y: hidden;
}
}
</style>

亲测可用~

最新文章

  1. [转]基于AWS的自动化部署实践
  2. 【练习】oracel获取当前session的id方法
  3. 2016 网易校招内推C/C++第二场8.6
  4. jQuery 根据JSON数据动态生成表格
  5. Redis Cluster架构和设计机制简单介绍
  6. C#核心语法
  7. Threejs 的场景查看 - 几个交互事件库助你方便查看场景
  8. centos安装svn
  9. 递归的二叉查找树Java实现
  10. 2018-2019-2 20165234 《网络对抗技术》 Exp2 后门原理与实践
  11. 初识 Proxysql
  12. 【MM系列】SAP里批量设置采购信息记录删除标记
  13. [WC2018]州区划分(FWT)
  14. JNI和NDK基础
  15. Android使用Fragment实现TabHost效果
  16. Django + Uwsgi + Nginx 实现生产环境 项目部署
  17. 使用Java语言开发微信公众平台(三)——被关注回复与关键词回复
  18. Django---路由如何配置
  19. Android中MD5加密
  20. C#监控文件夹变化

热门文章

  1. 【每日一题】【比较中右,内部比较中右,注意边界带&gt;=】2021年11月2日-搜索旋转排序数组-211102/220211
  2. 《HTTP权威指南》– 8.网关、Web机器人
  3. pycharm恢复删除文档与查询修改前数据
  4. 周结之json补充、正则re模块、hashlib模块、logging模块
  5. element-ui中table组件的表格嵌套Select,table中使用select
  6. CVE-2020-1938与CVE-2020-13935漏洞复现
  7. Flask初步认识
  8. 分享一般.net core的web项目发布到服务器环境的处理步骤(来自本人实践笔记)
  9. [机器学习] sklearn支持向量机
  10. Jupyter Notebook入门指南