我这里有两种方法都是可以用的

1,利用vue-router的默认模式hash,可以记录上一页的位置,如果需要点话,如果没有记录,在进入新页面的时候是返回到新页面的最顶部的

    scrollBehavior (to, from, savedPosition) {
console.log('这里是1:',to, from, savedPosition);
/*
* 如果有记录位置,进入新页面的时候滚动到记录的位置
* 如果没有记录位置,进入新页面的时候就在最顶部
*/
if(savedPosition) {
return savedPosition;
} else {
return { x: 0, y: 0 };
}
}

2,直接利用JavaScript的window的方法便可。

router.afterEach((to, from, next) => {
window.scrollTo(0,0);
})

vue-cli跳转到新页面的顶部的更多相关文章

  1. Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决

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

  2. PHP弹出提示框并跳转到新页面即重定向到新页面

    本文为大家介绍下使用PHP弹出提示框并跳转到新页面,也就是大家所认为的重定向,下面的示例大家可以参考下   这两天写一个demo,需要用到提示并跳转,主要页面要求不高,觉得没必要使用AJAX,JS等, ...

  3. react中实现点击跳转到新页面方法

    实现点击跳转到新页面,可以有两种形式,一个是本地页面打开,一个是本地页面不变跳转到新的页面. (一)页面点击本地页面打开新页面 引入ant的Button组件 <Button style={{ba ...

  4. 问题:使用ajax跳转到新页面无效(浏览器Safari)

    问题:使用ajax跳转到新页面无效(浏览器Safari)   window.open("{% url "runtestinfo" %}")   但是使用loca ...

  5. H5如何实现关闭当前页面,跳转到新页面?

    小程序有此功能的跳转方法. 那么H5如何实现该功能?  很简单. location.replace('new.html')  这个方法可以实现 关闭当前页面,跳转到新页面 的效果. 而   windo ...

  6. vue router 跳转到新的窗口方法

    在CreateSendView2.vue 组件中的方法定义点击事件,vue router 跳转新的窗口通过采用如下的方法可以实现传递参数跳转相应的页面goEditor: function (index ...

  7. Java web开发中页面跳转小技巧——跳转后新页面在新窗口打开

    最近学习Java web,在学习过程中想实现一个需求,就是在jsp页面跳转的时候,希望跳转后的新页面在新窗口中打开, 而不是覆盖原来的页面,这个需求使我困惑了好长时间,后来通过大海捞针似的在网上寻找方 ...

  8. vue 单页应用点击某个链接,跳转到新页面的方式

    <router-link class="goDetail" :to="{name: 'detail',params: {id:item.id}}" tar ...

  9. Android Studio实现页面跳转(新页面或者网站)

    一,跳转到另一个页面 百度了好久,好像好多种方法,从中挑选了一中比较方便的一中方法 利用Intent类进行实现 1,首先在firstActivity中添加相应的跳转命令代码 例如一下示例代码 if ( ...

随机推荐

  1. windows安装解压版mysql

    记录下用批处理安装mysql5.7.18的过程与踩到的坑 先在安装目录新建文件my.ini [mysql] default-character-set=utf8 basedir=TODO datadi ...

  2. npx命令介绍

    什么是npx 第一次看到npx命令是在 babel 的文档里 Note: If you do not have a package.json, create one before installing ...

  3. 从输入URL到浏览器显示页面发生了什么

    1.输入网址 当你开始输入网址比如www.cnblogs.com时游览器就可以在书签或者历史记录里面去搜索相关的网址推荐给你. 2.游览器查找域名的IP地址 ① 请求发起后,游览器首先会解析这个域名, ...

  4. codeforces gym 101611C 重链剖分构造

    给一棵树 要求在一个20*1e6的矩阵上放下这棵树,每个点的坐标都是整数且所有边都不相叉 题解 按照重链遍历,先给轻儿子坐标,然后沿着重儿子向下走即可 #include <bits/stdc++ ...

  5. Marshal.PtrToStringAnsi中文乱码

    出错代码: string dec = Marshal.PtrToStringAnsi(audioOutput.psz_description);//输出 鎵0鍣?(Realtek High Defi ...

  6. eclipse:插件安装总结

    1.SVN插件 首先安装SVNKIT,下载地址:https://svnkit.com/download.php 再安装Subclipse,这个在marketplace安装即可. 2.安装时报错:Una ...

  7. tcp与ip协议的区别

    TCP/IP(TransmissionControlProtocol/InternetProtocol的简写,中文译名为传输控制协议/互联网络协议). 简单地说,就是由底层的IP协议和TCP协议组成的 ...

  8. 初识C语言(二)

    C语言标识符的命名规则 变量或者函数起的名字就是标识符,而且C语言的标识符有它自己的命名规则: 标识符的长度最好不要超过8位,因为在一些版本的C语言中标示符的前八位是有效的,所以当两个标识符的前八位相 ...

  9. ELK搭建<三>:安装Kibana

    1.下载Kibana,如果需要低版本的,低版本下载 2.解压后,进入config修改配置文件kibana.yml : #运行的端口号 server.port: 5601 #服务器地址 server.h ...

  10. 2018-2019-2 网络对抗技术 20165314 Exp4 恶意代码分析

    一.原理与实践说明 1.实践目标 监控你自己系统的运行状态,看有没有可疑的程序在运行. 分析一个恶意软件,就分析Exp2或Exp3中生成后门软件:分析工具尽量使用原生指令或sysinternals,s ...