Element-ui 简单实现表格滚动(附演示及源码)

本文介绍如何使用 Vue 和 Element-ui 框架实现表格滚动效果。通过预览图展示,详细说明了查看UI、设置滚动动作及操作步骤。提供了演示地址和源码链接供参考。
摘要由CSDN通过智能技术生成

1 前 言

1.1 预览图

1.2 介 绍

功能很简单,不确定方法有没有问题,所以写出来让大家来检查检查

1.3 使用技术

  • Vue
  • Element-ui

2 实 现

2.1 查看UI

这里是直接使用 UI 里的表格组件,F12 查看

可以明显看出:

  • 表格头 class="el-table__header-wrapper"
  • 表格体 class="el-table__body-wrapper"
  • 表格高度默认 48px

2.2 滚 动

我们想要的效果是向下滚动,即向下移动 48px

//  获取表格体
let t = document.getElementsByClassName('el-table__body-wrapper')
setTimeout(() =>{
    t[0].style.transition = 'all .5s'
    t[0].style.marginTop 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值