Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决
今天碰到一个问题 vue路由跳转到新的页面时会直接显示页面最底部 正常情况下是显示的最顶部的 而且好多路由中不是全部都是这种情况 折腾好长时间也没解决 最后在网上找到了解决办法
其实原理很简单 就是在页面加载完毕后 把滚动条的距离设置为(0,0) 就解决了
mounted ()
this.$router.afterEach((to, from, next) => {
window.scrollTo(0, 0)
})
}
很不理解的就是为什么会出现这种情况呢?
Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决的更多相关文章
- vue 路由跳转前确认框,刷新浏览器页面前提示确认框
先看效果图: 1.刷新页面效果: 2.跳转路由(进入别的页面前)效果: 代码: // 路由跳转确认 beforeRouteLeave(to, from, next) { const answer = ...
- vue路由跳转取消上个页面的请求和去掉重复请求
vue路由跳转取消上个页面的请求和去掉重复请求 axios 的二次封装(拦截重复请求.异常统一处理) axios里面拦截重复请求
- vue路由跳转的方式
vue路由跳转有四种方式 1. router-link 2. this.$router.push() (函数里面调用) 3. this.$router.replace() (用法同push) 4. t ...
- 详解vue 路由跳转四种方式 (带参数)
详解vue 路由跳转四种方式 (带参数):https://www.jb51.net/article/160401.htm 1. router-link ? 1 2 3 4 5 6 7 8 9 10 ...
- vue路由跳转报错解决
vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...
- 去除vue路由跳转地址栏后的哈希值#
去除vue路由跳转地址栏后的哈希值#,我们只需要在路由跳转的管理文件router目录下的index.js中加上一句代码即可去掉哈希值# mode:"history" import ...
- 关闭open页面时刷新父页面列表
var winObjEI = window.open("/Invoice/InvoiceViewEI?invoiceid=" + data.InvoiceId); ; //关闭op ...
- Vue路由跳转时显示空白页面,iview的使用
最近在用iview做项目,需要实现登录,注册,忘记密码等功能.iview-admin本来就有登录功能,于是想照葫芦画瓢,实现登录界面的注册,忘记密码页面路由跳转. router.js里路由配置,刚开始 ...
- vue路由跳转时判断用户是否登录功能
通过判断该用户是否登录过,如果没有登录则跳转到login登录路由,如果登录则正常跳转. 一丶首先在用户登录前后分别给出一个状态来标识此用户是否登录(建议用vuex): 简单用vuex表示一下,不会可以 ...
随机推荐
- plsql developer 执行sql 文件
用 Command Window,执行 @'sql file path' 注意,上面sql文件路径要加单引号
- postman的安装和使用方法详解
文章来源:http://www.cnplugins.com/tool/specify-postman-methods.html 非官网安装 这是一种直接通过打包已经安装的扩展程序的方式,来进行我认为的 ...
- 一份比较完整的gulpfile.js
var gulp = require('gulp'); //工具 var autoprefixer = require('gulp-autoprefixer'); var include = requ ...
- 9.数据分组 ---SQL
一.创建分组 分组是使用SELECT语句的GROUP BY子句建立的.理解分组的最好办法是看一个例子: SELECT vend_id, COUNT(*) AS num_prods FROM Produ ...
- QDU-GZS and String
Description GZS has two strings s and t. In each step, GZS can select arbitrary character c of s and ...
- codechef FIBTREE 码农题 线段树 树剖 标记永久化
好烦啊,调了半天 线段树部分标记比较多,手抖打错了一个 剩下的都是取模的问题 我自己瞎jb推的公式里保留了abs,但是在模意义下是gg的,所以必须把正负区分开 调试的时候一定要注意构造各种形状的树,不 ...
- 寒假作业第二组E题题解
注意看题,注意看题,注意看题.重要的事情三遍感觉都不够.不怕大家笑话,这道题RuntimeError 9次,我一直以为是哪里越界了,结果最后发现的时候,真是无语了,题目里说了,所有的integer都不 ...
- hibernate Restrictions用法 HibernateTemplate Hibernate结合spring
常用方法 http://www.jb51.net/article/41541.htm ........................................... 博客分类: Hiberna ...
- Try .NET离线版
https://github.com/dotnet/try Try .NET离线版 使用Try.NET创建可交互.NET文档 原文地址:Create Interactive .NET Docume ...
- Net Core下通过Proxy 模式
Net Core下通过Proxy 模式 NET Core下的WCF客户端也是开源的,这次发布.NET Core 2.0,同时也发布了 WCF for .NET Core 2.0.0, 本文介绍在.NE ...