vue element点击分页，页面跳回顶部

最新推荐文章于 2024-07-21 13:23:50 发布
最新推荐文章于 2024-07-21 13:23:50 发布
阅读量1.9k 收藏
点赞数
分类专栏： vue 文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44949068/article/details/123407344
版权 
// 翻页后滚动条回到页面顶端
    scrollTop (selector) {
      let element = selector && document.querySelector(selector) || window;
      element.scrollTo(0, 0);
    },
    // 监听 页码值 改变的事件
    handleCurrentChange (newPage) {
      // console.log(newPage);
      this.queryInfo.page_num = newPage
      this.getUserList()
      this.scrollTop(".tabledns");
    },
大吉大利的卦象
关注
专栏目录
vue element - ui 项目， scrollbar模块，切换页面不置顶
Shimeng_1989的博客
10-24 1147
我们项目为vue项目，整个html是分为三个区域 上、下、（下面部分包含：）左、右。 问题为：点击左侧菜单，切换路由，（新页面）右侧内容区域为当前scrolltop高度，未置顶（未从顶部显示）。 解决方法： 1、先检查路由文件是否添加 下段代码（此段代码是将整个页面（html）置顶显示，而我们项目是分为上下两块div，上部分为20%，下面高度为80%，下部分又分为左右两部份，左侧围...
vue-element-admin::rainbow: 基于 Vue 和 Element UI，快速搭建起一个企业中后台产品原型系统
05-09
:rainbow: 基于 Vue 和 Element UI，能够快速搭建起一个企业中后台产品原型，内置路由权限验证，高级列表，万能分页，引导动画等业务模型，方便扩展，极大提高生产力 内置功能 账户 User 登录 注销 注册 路由权限...
点击下一页之后，页面自动回滚到顶部
qq_46617584的博客
11-18 502
点击下一页之后，页面自动回滚到顶部
vue elementUI中 el-table 如何在切换页码让滚动条回到顶部或底部
最新发布
weixin_58586234的博客
07-21 792
使用el-table显示数据，当滚动到最底部，再点击切换分页时，回显过来数据后，滚动条依然在页面底部。
vue+element ui列表使用分页组件 翻页的时候返回页面顶部
小猫爪子
06-16 3325
此时滚动条已经翻到页面底部，更换上一页或者下一页时，重新回到页面顶部。 // 翻页后滚动条回到页面顶端 scrollTop(selector) { let element = selector && document.querySelector(selector) || window; element.scrollTo(0, 0); }, //切换页面 currentChangeHandle(val) { this.pageIndex = val //找到你想要滚到
vue中使用elementUI分页实现切换页面时返回页面顶部
jiangjunyuan168的博客
05-11 2626
原理： 给elementUI分页组件的切换页面时触发事件（在这里就是handleCurrentChange函数）添加一个跳转到页顶的方法即可。 实现： <!-- 分页组件 --> <el-pagination @current-change="handleCurrentChange" > </el-pagination> //跳到页顶 scrollTop(selector) { let element = selector && document
jqGrid分页点击事件，点击分页的时候滚动条回到顶端
笑到世界都狼狈的博客
12-11 686
首先分页的点击事件如下： //点击分页 onPaging: function () { //点击分页的时候，滚动条回到顶端 $(".ui-jqgrid-bdiv").animate({scrollTop:0},1000); }, 参照地址：点击分页：https://www.w3xue.com/exp/article/201810/3205.html div滚动条回到顶部：https://www.cnblogs.com/chengkun101/p/4588092.html ...
vue2+element打开抽屉自动跳转到页面最顶端问题
woysihsb的博客
01-29 626
当路由组件（子组件）中执行打开抽屉操作的时候，滚动到中部或底部的滚动条自动滚动到页面的最顶端。暂时不确定为啥，但是试错试出来了是遮罩层的问题。父组件中存放着路由组件，抽屉组件。抽屉组件的遮罩层导致。
Element-ui 组件 backtop回到顶部
weixin_70777902的博客
05-08 616
首先我们可以先去element-ui官网进行查看参数有target：就是元素定义的class类名visibility-height: 鼠标向下滚动到自己定义的数值后出现返回顶部标签right:控制其显示位置，距离页面右边距bottom：控制其显示位置，距离页面左边距。
BackToTop.zip
11-05
这是一个可以快速回到页面顶部的组件，当用户浏览到页面底部的时候，通过点击按钮，可快速回到页面顶部。 应用方法详见博文：https://shq5785.blog.csdn.net/article/details/102917007
vue-element-table:一款基于element-ui封装的基于JSON配置的表格，支持分页，按钮，行编辑等等功能
03-20
在开发管理系统的时候，经常会开发大量的表格，但是直接使用element-ui的原生组件时候，既写法繁琐，而且本身并不本身分页，行编辑，顶部按钮等等功能，需要通过插槽或多个组件组合才能实现，本项目是基于element-ui...
Element Plus 教程(beta版，适配 Vue 3.0 的 Element).pdf
02-28
Element Plus 是一个基于 Vue 3.0 的 UI 组件库，它是著名的 Element UI 框架针对 Vue 3.0 进行的升级版。Element Plus 保持与 Element UI 的设计理念一致，同时适配 Vue 的新特性，为开发者提供了一套现代化的UI...
Vue每次点击跳转页面位置回恢复在顶部
weixin_46605745的博客
07-14 1493
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
模态框出现滚动条，点击分页的时候返回顶部
cy1291629279的博客
05-25 582
最近用antd 和vue 在做一个关于小说的后台管理系统。有一个关于模态框滚动条，点击分页的时候返回顶部的需求。设置返回顶部，必须要给滚动区域的包裹层设置 因此，我给div 设置了ref属性。当滚动条，下拉到底部的时候，点击上一章，或者下一章，需要将滚动条返回顶部。
Element ui分页切换页面回到顶部
weixin_43585219的博客
12-20 1292
document.querySelector(".body").parentNode.scrollTop=0 针对这一行 1、document.querySelector（）方法返回文档中匹配指定 CSS 选择器的一个元素。 注意： querySelector() 方法仅仅返回匹配指定选择器的第一个元素。 2、由此可以获取元素的DOM节点 3、scrollTop为滚动条的垂直偏移，是拥有滚动条元素的属性，如下，切换页数时，若想使列表回到顶部，其拥有scrollTop的元素为el-main，而不是列表本身
使用el-pagination实现翻页自动回到顶部
票票的博客
06-16 2809
定义$scrollTo方法挂载在vue全局 // main.js Vue.prototype.$scrollTo = (x = 0, y = 0, type = 'smooth') => { window.scrollTo({ top: x, left: y, behavior: type // 滚动行为：smooth平滑滚动，instant瞬间滚动，默认值auto，等同于instant }) } // 使用方法 this.$scrollTo() ...
分页列表切换时回到窗口顶部（个人实战）
q915730058的博客
11-05 636
在切换列表的时候，运行toTop()方法 例如： <ul> <li @click="toTop(100)" > <!--传值根据自己要求--> </li> </ul> methods: { toTop(i){ //参数i表示间隔的幅度大小，以此来控制速度，例如50 console.log(doc...
element-plus 表格翻页之后滚动条回到顶部
niyooooo的博客
04-12 2068
给el-table添加属性ref="tableRef"，再将这个ref对象创建出来 let tableRef = ref(null); 最后在翻页触发的事件中写 tableRef.value.setScrollTop(0);
vue页面跳转自动滚动到页面最上方
qq_48637533的博客
10-06 2552
vue-router实现滚动行为
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值