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

  解决办法:我试过几种办法,感觉最简单的办法就是在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. 填IP那个就算是接口式开发,这回随便填

    ///////////////////////////////////////////////////////////using namespace std; #include<stdlib.h ...

  2. springboot3时代创建springboot2程序项目

    springboot3时代创建springboot2程序项目 目前,IDEA,springboot 官网,都不能创建基于JDK8(JDK1.8)的springboot程序了. 解决办法: 1. 先在官 ...

  3. C#.NET WINFORM 缓存 System.Runtime.Caching MemoryCache

    C#.NET WINFORM 缓存 System.Runtime.Caching MemoryCache 工具类: using System; using System.Runtime.Caching ...

  4. 如何基于Perl实现批量蛋白名转换为基因名?以做后续GO与KEGG分析

    众所周知,在完成蛋白组学组间差异蛋白筛选后,往往要做GO与KEGG功能富集分析,这就需要我们首先将蛋白名转换为基因名,或者找出基因ID.将蛋白名转化为基因名可能涉及不同的转换工具或数据库,这里有几种常 ...

  5. 有点东西,template可以直接使用setup语法糖中的变量原来是因为这个

    前言 我们每天写vue3代码的时候都会使用到setup语法糖,那你知道为什么setup语法糖中的顶层绑定可以在template中直接使用的呢?setup语法糖是如何编译成setup函数的呢?本文将围绕 ...

  6. 三月十五号 anaconda 安装 tensorflow 教程

    今天下载anaconda 并安装tensorflow 首先下载anaconda  因为官网下载特别慢 所有选择国内镜像网站 https://mirrors.tuna.tsinghua.edu.cn/a ...

  7. linux挂载的ntfs格式硬盘无法使用回收站

    linux挂载的ntfs格式硬盘无法使用回收站 解决办法: 新建回收站文件, 文件名为Trash-XXX . 比如Trash-1000 这里的1000就是你的$UID. sudo mkdir /.Tr ...

  8. hive第二课:Hive3.1.2分区与排序以及分桶(内置函数)

    Hive3.1.2分区与排序(内置函数) 1.Hive分区(十分重要!!) 分区的目的:避免全表扫描,加快查询速度! 在大数据中,最常见的一种思想就是分治,我们可以把大的文件切割划分成一个个的小的文件 ...

  9. 高通平台UEFI有关介绍

    高通平台UEFI有关介绍 背景 我需要在高通平台上学习点亮LCD,目前通过同事在别的平台的配置代码,我已经将kernel部分的屏幕点亮了:剩余的工作量就在BP侧,也就是系统刚开机的那一段时间.在开发过 ...

  10. 金蝶云·苍穹追光者开发大赛,点燃高校AI应用创新之火

    在 2024 年的政府工作报告中,"人工智能 +" 行动被提出,标志着人工智能成为推动我国新质生产力发展的关键力量.与此同时,今年的高考作文有一道题目也聚焦于人工智能,再次凸显了这 ...