elementui table 自动滚动 纯js实现

news/2025/3/17 3:04:00/
startTableScroll() {// 获取表格滚动容器const tableWrapper = this.$refs.tableRef.$el.querySelector('.el-table__body-wrapper');if (tableWrapper) {this.scrollInterval = setInterval(() => {// 每次滚动 1 像素tableWrapper.scrollTop += 1;// 判断是否滚动到底部if (tableWrapper.scrollTop >= tableWrapper.scrollHeight - tableWrapper.clientHeight) {// 滚动到底部后重置滚动位置到顶部tableWrapper.scrollTop = 0;}}, 30); // 每 30 毫秒滚动一次}
},
stopTableScroll() {if (this.scrollInterval) {clearInterval(this.scrollInterval);this.scrollInterval = null;}
},
resetTableScroll() {// 重置表格滚动位置到顶部const tableWrapper = this.$refs.tableRef.$el.querySelector('.el-table__body-wrapper');if (tableWrapper) {tableWrapper.scrollTop = 0;}
}

::v-deep.el-table__body-wrapper::-webkit-scrollbar {width: 0 !important;
}::v-deep .el-table__body-wrapper {scrollbar-width: none;-ms-overflow-style: none;
}   去掉bar

http://www.ppmy.cn/news/1579722.html

相关文章

DeepSeek + Excel:数据处理专家 具体步骤

将DeepSeek与Excel结合使用,可显著提升数据处理效率,实现智能化的数据分析、清洗、计算及可视化。以下是具体操作步骤及核心技巧的综合指南: 一、接入DeepSeek的两种主要方法 1. 插件接入法(推荐) 步骤1:…

R语言的链表合并

R语言的链表合并 在计算机科学中,链表是一种常用的数据结构,通过节点(node)来动态存储数据。与传统的数组不同,链表的每个元素(节点)都包含指向下一个元素的指针,这种结构使得插入和…

高级线程管理_第九章_《C++并发编程实战》笔记

高级线程管理 1. 线程池(Thread Pool)1.1 线程池结构要素1.2 线程池实现步骤 2. 线程中断(Interruptible Threads)2.1 中断机制实现 多选题多选题答案设计题目设计题目答案 1. 线程池(Thread Pool) 核心目…

论文笔记 - ULTRA-SPARSE MEMORY NETWORK

1、目前Transformer模型现状 dense模型相同激活参数下,性能远低于MOE模型,因此大家倾向于训练MOE模型虽然同激活参数下,MOE性能比dense好,但MOE模型内存访问高,因此推理速度相比dense要慢不少。比如top2的moe&#xf…

STM32-Unix时间戳

一:什么是时间戳 Unix时间戳(Unix Timestamp)是一个计数器数值,这个数值表示的是一个从1970年1月1日0时0分0秒开始到现在所经过的秒数,不考虑闰秒。 时间戳存储在一个秒计数器里,秒计数器为32位/64位的整…

并发编程面试题一

1、什么是进程、线程、协程,他们之间的关系是怎样的 进程是操作系统进行资源分配和调度的基本单位。每个进程都有独立的内存空间,进程之间相互独立,一个进程崩溃不会影响其他进程,进程间通信(IPC)需要通过…

数字孪生技术在工业制造中的应用探索

一、数字孪生:工业4.0的虚实纽带 1.1 技术定义与发展脉络 数字孪生(Digital Twin)通过实时数据映射,在虚拟空间构建物理实体的动态镜像。其演进历程: 概念萌芽(2002年):NASA首次提…

生成对抗网络(GAN)原理与应用

目录 一、引言 二、GAN的基本原理 (一)生成器(Generator)的工作机制 (二)判别器(Discriminator)的工作机制 (三)对抗训练的过程 三、GAN在AIGC生图中的应…