前景:我们在网页里进入路由的地址后,会发现地址栏中会加上我们的路由地址,这样我就知道当前在哪个位置。但是这样子我们如何手动刷新浏览器,想要浏览器回到根路径的话,是无法直接回去的,因为地址没有更改。再怎么刷新也是路由之后的位置。

  解决办法:我试过几种办法,感觉最简单的办法就是在created 或者 mounted方法中使用路由回到根路径。


  这两个方法是Vue生命周期里面提供的钩子函数,具体请查看https://cn.vuejs.org/v2/guide/index.html

1 <script>
2 export default {
3 mounted() {
4 this.$router.replace('/');
5 }
6 };
7 </script>

Vue cil路由如何回到初始状态的更多相关文章

  1. vue基础 (三) 自动化工具(Vue CIL)

    一.自动化工具(Vue CIL) 安装过程 1. 先安装nvm 参考:https://www.jianshu.com/p/d0e0935b150a https://www.cnblogs.com/tj ...

  2. Vue 嵌套路由使用总结

    Vue 嵌套路由使用总结   by:授客 QQ:1033553122   开发环境   Win 10   node-v10.15.3-x64.msi 下载地址: https://nodejs.org/ ...

  3. vue(5)—— vue的路由插件—vue-router 常用属性方法

    前端路由 看到这里可能有朋友有疑惑了,前端也有路由吗?这些难道不应该是在后端部分操作的吗?确实是这样,但是现在前后端分离后,加上现在的前端框架的实用性,为的就是均衡前后端的工作量,所以在前端也有了路由 ...

  4. vue父路由默认选中第一个子路由,切换子路由让父路由高亮不会消失

    vue父路由默认选中第一个子路由,切换子路由让父路由高亮不会消失 正常默认会有 .router-active-class 识别高亮 达到以上注意: 1. exact 不要加 注意是不要加,exact ...

  5. vue的路由映射问题

    遇到的问题 今天在项目中遇到了一个问题,明明在Router文件夹下的路由js映射文件中,配置好了,如下: // 生日贺卡 { path: 'birthdayRemind', component: lo ...

  6. 前端MVC Vue2学习总结(八)——Vue Router路由、Vuex状态管理、Element-UI

    一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...

  7. Vue.js路由

    有时候,我们在用vue的时候会有这样的需求,比如一个管理系统,点了左边的菜单栏,右边跳转到一个新的页面中,而且刷新的时候还会停留在原来打开的页面. 又或者,一个页面中几个不同的画面来回点击切换,这两种 ...

  8. Vue.js路由详解

    有时候,我们在用vue的时候会有这样的需求,比如一个管理系统,点了左边的菜单栏,右边跳转到一个新的页面中,而且刷新的时候还会停留在原来打开的页面. 又或者,一个页面中几个不同的画面来回点击切换,这两种 ...

  9. vue权限路由实现方式总结二

    之前已经写过一篇关于vue权限路由实现方式总结的文章,经过一段时间的踩坑和总结,下面说说目前我认为比较"完美"的一种方案:菜单与路由完全由后端提供. 菜单与路由完全由后端返回 这种 ...

  10. Vue 多路由文件的合并

    Vue 多路由文件的合并 1.使用的是ES6 数组的合并方法 let routes = new Set([...routes1, ...homerouters]);2.两个路由文件,导出的实际上就是一 ...

随机推荐

  1. nginx001

    本文档版权归属:陈雷雷,仅限学习交流 QQ:370460470 blog:www.chenleilei.net Nginx服务实践 简述Nginx(nginx.org) Nginx (engine x ...

  2. 7.12考试总结(NOIP模拟12)[简单的区间·简单的玄学·简单的填数]

    即使想放弃,也没法放弃最想要的东西,这就是人 前言 这次应该是和 SDFZ 一起打的第一场比赛吧. 然而我还是 FW 一个... 这次考试也有不少遗憾,主要的问题是码力不足,不敢去直面正解,思考程度不 ...

  3. vmware vmnat1和vmnat8在真机网络适配器中消失

    在真机的网络适配器中,发现只有两张网卡.缺少vmnat1和vmnat8 一,查看虚拟网络编辑器是否连接 二,如果没有连接,勾选连接就好了. 三,如果连接了,真机网络适配器仍然只有两张网络适配器. 1. ...

  4. kettle从入门到精通 第六十六课 ETL之kettle kettle阻塞教程,轻松获取最后一行数据,so easy

    场景:ETL沟通交流群内有小伙伴反馈,如何在同步一批数据完成之后记录下同步结果呢?或者是调用后续步骤.存储过程.三方接口等. 解决:使用步骤Blocking step进行阻塞处理即可. 1.下面的de ...

  5. docker-20.10.24搭建ferry工单系统

    安装文档 https://www.fdevops.com/docs/ferry-tutorial-document/introduction 必须要有docker环境,19.03以上的 本文档需用户自 ...

  6. TiDB 多集群告警监控-初章-监控融合、自动告警处理

    author:longzhuquan 背景 随着公司XC改造步伐的前进,越来越多的业务选择 TiDB,由于各个业务之间需要物理隔离,避免不了的 TiDB 集群数量越来越多.虽然每套 TiDB 集群均有 ...

  7. flutter 尝试创建第一个页面(三)

    新建目录 assets  存放图片 在pubspec..yaml 中添加 flutter: # The following line ensures that the Material Icons f ...

  8. sqlyog 工具 查看 历史记录

    sqlyog 工具 查看 历史记录 可以查看当前客户端的执行脚本的情况

  9. es6.6.1 java客户端 client基础操作

    1.引入jar包 <dependency> <groupId>org.elasticsearch.client</groupId> <artifactId&g ...

  10. .htaccess伪静态规则

    Tips:当你看到这个提示的时候,说明当前的文章是由原emlog博客系统搬迁至此的,文章发布时间已过于久远,编排和内容不一定完整,还请谅解` .htaccess伪静态规则 日期:2017-12-4 阿 ...