今天碰到一个问题   vue路由跳转到新的页面时会直接显示页面最底部  正常情况下是显示的最顶部的  而且好多路由中不是全部都是这种情况  折腾好长时间也没解决  最后在网上找到了解决办法

其实原理很简单  就是在页面加载完毕后  把滚动条的距离设置为（0，0） 就解决了

mounted ()

    this.$router.afterEach((to, from, next) => {

        window.scrollTo(0, 0)

    })

}

很不理解的就是为什么会出现这种情况呢？

Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决的更多相关文章

  1. vue 路由跳转前确认框，刷新浏览器页面前提示确认框

    先看效果图: 1.刷新页面效果: 2.跳转路由(进入别的页面前)效果: 代码: // 路由跳转确认 beforeRouteLeave(to, from, next) { const answer = ...

  2. vue路由跳转取消上个页面的请求和去掉重复请求

    vue路由跳转取消上个页面的请求和去掉重复请求 axios 的二次封装(拦截重复请求.异常统一处理) axios里面拦截重复请求

  3. vue路由跳转的方式

    vue路由跳转有四种方式 1. router-link 2. this.$router.push() (函数里面调用) 3. this.$router.replace() (用法同push) 4. t ...

  4. 详解vue 路由跳转四种方式 (带参数)

    详解vue 路由跳转四种方式 (带参数):https://www.jb51.net/article/160401.htm 1.  router-link ? 1 2 3 4 5 6 7 8 9 10 ...

  5. vue路由跳转报错解决

    vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...

  6. 去除vue路由跳转地址栏后的哈希值#

    去除vue路由跳转地址栏后的哈希值#,我们只需要在路由跳转的管理文件router目录下的index.js中加上一句代码即可去掉哈希值# mode:"history" import ...

  7. 关闭open页面时刷新父页面列表

    var winObjEI = window.open("/Invoice/InvoiceViewEI?invoiceid=" + data.InvoiceId); ; //关闭op ...

  8. Vue路由跳转时显示空白页面，iview的使用

    最近在用iview做项目,需要实现登录,注册,忘记密码等功能.iview-admin本来就有登录功能,于是想照葫芦画瓢,实现登录界面的注册,忘记密码页面路由跳转. router.js里路由配置,刚开始 ...

  9. vue路由跳转时判断用户是否登录功能

    通过判断该用户是否登录过,如果没有登录则跳转到login登录路由,如果登录则正常跳转. 一丶首先在用户登录前后分别给出一个状态来标识此用户是否登录(建议用vuex): 简单用vuex表示一下,不会可以 ...

随机推荐

  1. python3编程技巧二——如何在列表、字典、集合 中根据条件筛选数据

    一.列表筛选数据 # coding=utf-8 from random import randint # 创建随机列表 l = [randint(-10, 10) for i in range(10) ...

  2. Python学习笔记(数据处理）

    处理文件中数据 (统计分数) 看一下我们的文档里的数据: #-- scores.txt 刘备 23 35 44 47 51 关羽 60 77 68 张飞 97 99 89 91 诸葛亮 100 1.先 ...

  3. IDEA打开项目格式问题

    今天遇到一个奇葩问题,从git上面迁maven代码下来后,然后打开文件,加载项目,会导致Modules模块加载的内容不正确,出现这种情况,要么删除原来的模块,重新导入main模块,要么采用第三张图片的 ...

  4. layui实现下拉分类多级

    Layui tree 下拉菜单树   1.效果: 2.html  代码: <!DOCTYPE html> <html> <head> <meta charse ...

  5. SpringMVC之一个简单的例子

    一.一个简单的例子 二.web.xml文件配置 三.spring-mvc.xml文件(等同于struts2的struts文件) 四.login.jsp(登录页面) 五.登录成功的页面(success. ...

  6. C 语言实例 - 循环输出26个字母

    C 语言实例 - 循环输出26个字母 循环输出 个字母. 实例 #include <stdio.h> int main() { char c; for(c = 'A'; c <= ' ...

  7. git push error: ! [rejected] failed to push some refs to . . .

    报错情况: 报错原因:远程库与本地库不一致造成的,需要把远程库同步到本地库! 解决办法: git pull --rebase origin master 这条指令是将远程库中的更新合并到本地库,--r ...

  8. 使用JS判断客户端、浏览器、操作系统类型

    一.JS判断客户端类型 JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端. 核心代码如下: 方法一: &l ...

  9. nacos1.0.0 服务管理使用mysql

    在自己的MySQL中添加nacos_config数据库,在nacos\conf 下找到nacos-mysql.sql.拷贝里面的sql语句创建表和数据 INSERT INTO users (usern ...

  10. vuex初使用（写的当然是最简单的应用啦）

    关于vuex的简图 vuex文档:https://vuex.vuejs.org/zh-cn/installation.html 一:npm安装 npm install vuex --save 在mai ...