当前位置: 首页 > news >正文

element -ui table表格内容无限滚动 使用插件vue-seamless-scroll

使用插件

一、安装组件依赖
npm install vue-seamless-scroll

二、引入组件

import vueSeamlessScroll from "vue-seamless-scroll";

components: { vueSeamlessScroll },

   <div class="table-list "><vue-seamless-scroll :class-option="Option" :data="tableData" class="seamless-warp"style="width: 100%; height: 20px;"><el-table ref="table" :data="tableData" style="width: 100%;margin-top:5px" :show-header="false" height="calc(100% - 40px)" size="small"><el-table-column prop="date4" label="监督姓名" algin="center" /><el-table-column prop="date7" label="驻派动态" algin="center" /></el-table></vue-seamless-scroll></div>

 computed: {Option() {return {step: 0.2, // 数值越大速度滚动越快limitMoveNum: 1, // 开始无缝滚动的数据量 this.Data.lengthhoverStop: false, // 是否开启鼠标悬停stopdirection: 1, // 0向下 1向上 2向左 3向右openWatch: true, // 开启数据实时监控刷新domsingleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3waitTime: 1000, // 单步运动停止的时间(默认值1000ms)};},},

  .table-list {width: 100%;height: calc(100% - 65px);overflow: hidden;}

http://www.lryc.cn/news/166078.html

相关文章:

  • 如何在windows环境下编译T
  • USB接口针式打印机
  • 外贸建站教程步骤有哪些?独立站怎么搭建?
  • useGetState自定义hooks解决useState 异步回调获取不到最新值
  • input子系统框架、外设驱动开发
  • Google Chrome 浏览器以全屏模式打开
  • 安装torch113、cuda116并运行demo【Transformer】
  • 基于scRNA-seq的GRN分析三阴性乳腺癌的肿瘤异质性
  • Python:二进制文件实现等间隔取相同数据量并合并
  • python使用openvc库进行图像数据增强
  • 如何利用Api接口获取手机当前的网络位置信息
  • vue-elementPlus自动按需导入和主题定制
  • idea中dataBase模板生成
  • pc端测试手机浏览器运行情况,主要是测试硬件功能
  • 软件概要设计-架构真题(二十五)
  • CSDN发文表情包整理
  • springBoot对接Apache POI 实现excel下载和上传
  • 定积分的计算:牛顿-莱布尼茨公式
  • shell脚本之case 的用法
  • 第3章 helloworld 驱动实验(iTOP-RK3568开发板驱动开发指南 )
  • 基于PyTorch使用LSTM实现新闻文本分类任务
  • Flutter插件的制作和发布
  • 【JAVA】异常
  • 合同矩阵充要条件
  • 数据分析三剑客之Pandas
  • Spring Boot自动装配原理
  • VMware Workstation虚拟机网络配置及配置自动启动
  • 智能语音机器人竞品调研
  • 【操作系统】进程的概念、组成、特征
  • 大二第二周总结