问题:  导航栏的地址发生改变但是页面却不刷新  (用vue-router路由到当前页面,页面是不进行刷新的)
解决:

  1.);

         

  2.location.reload()

       

  上两种方法  都会出现闪屏的问题   用户体验不好

  3. 用一个空页面做中转,解决了闪屏的问题,可以看到导航栏路径的快速切换

   (这个方法在切换的时候生效,但是在返回上一步的时候因为路由切换的原因所以返回到/loading页面又再次返回来   如果说路由切换不是通过返回上一步实现  这个方法还是可取的)

中间层页面:  

    组件使用页:

    

      以上方法都满足不了  我的需求

    同志们!!!!  别本页了  开新页吧     只需window.open一下   一句代码解决所有烦恼     (如果产品乐意的话)

    

    终级解决。。。。。nice

    4App.vue,声明reload方法,控制router-view的显示或隐藏,从而控制页面的再次加载。(provide /inject )

      【祖先组件(provide )向其所有子孙后代(inject )注入一个依赖】

    App.vue中:

    1.data中声明变量  2.绑定v-if    3.方法里写逻辑   4.向后代注入依赖

   

    在需要的页面 调用方法

    我需要在当前页点击链接刷新本页   刷新后点击页面返回上一步再次刷新本页  所以需要两处调用reload方法;

    

    

  

   

    结束。。。。。。。。。。

    

    

vue中router跳转本页刷新的更多相关文章

  1. Vue中router两种传参方式

    Vue中router两种传参方式 1.Vue中router使用query传参 相关Html: <!DOCTYPE html> <html lang="en"> ...

  2. vue 中router.go;router.push和router.replace的区别

    vue 中router.go:router.push和router.replace的区别:https://blog.csdn.net/div_ma/article/details/79467165 t ...

  3. vue中$router以及$route的使用

    路由基本概念 route,它是一条路由. { path: '/home', component: Home } routes,是一组路由. const routes = [ { path: '/hom ...

  4. vue中router以及route的使用

    路由基本概念 route,它是一条路由. { path: '/home', component: Home } routes,是一组路由. const routes = [ { path: '/hom ...

  5. Vue中router路由的使用、router-link的使用(在项目中的实际运用方式)

    文章目录 1.先看router中的index.js文件 2.router-link的使用 3.实现的效果 前提:router已经安装 1.先看router中的index.js文件 import Vue ...

  6. vue中$router.push打开新窗口

    在vue中使用 this.$router.push({ path:  '/home' }) 默认是替代本窗口 如果想新开一个窗口,可以使用下面的方式: let routeData = this.$ro ...

  7. vue中$router和$route的区别

    $router是VueRouter的实例,在script标签中想要导航到不同的URL,使用$router.push方法. 返回上一个历史history用$router.to(-1) $route为当前 ...

  8. vue中$router 与 $route区别

    vue-router中经常会操作的两个对象\(route和\)router两个. 1.$route对象 $route对象表示当前的路由信息,包含了当前 URL 解析得到的信息.包含当前的路径,参数,q ...

  9. vue中router与route区别

    1.$route对象 $route对象表示当前的路由信息,包含了当前 URL 解析得到的信息.包含当前的路径,参数,query对象等. 1.    $route.path      字符串,对应当前路 ...

随机推荐

  1. 数据类型(二)---day04

    目录 上节课回顾 五 变量 (一)什么是变量 (二)变量的组成 (三)变量名的命名规范 (四)常量 (五)python变量内存管理 (六)变量的三种打印方式 六 数据类型 (一)数字类型 (二)字符串 ...

  2. day07整理(内置方法\循环判断)

    目录 一.上节课回顾 (一)if判断 1.单分支结构 2.双分支结构 3.多分支结构 (二)for循环 1.for + break 2.for + continue 3.for循环嵌套 (三)robu ...

  3. OptimalSolution(3)--链表问题(2)进阶

    一.环形单链表的约瑟夫问题 二.判断一个链表是否为回文结构 三.将单向链表按某只划分成左边小.中间相等.右边大的形式 四.复制含有随机指针节点的链表 五.两个单链表相交的一系列问题 六.将单链表的每K ...

  4. Spring(二)装配Spring Bean

    控制反转的概念:控制反转是一种通过描述(在Java中或者是XML或者注解)并通过第三方去产生或获取特定对象的方式. 在Spring中实现控制反转的是IoC容器,其实现方法是依赖注入(Dependenc ...

  5. Redis(十)集群:Redis Cluster

    一.数据分布 1.数据分布理论 2.Redis数据分区 Redis Cluser采用虚拟槽分区,所有的键根据哈希函数映射到0~16383整数槽内,计算公式:slot=CRC16(key)&16 ...

  6. MongoDB系列---用户及权限管理02

    MongoDB-——Privilege 学习大纲: 1.用户权限管理 2.用户操作 知识回顾:  本系列上一篇博文我们讲述了如何搭建环境以及配置我们的MongoDB,通过搭建环境后我们又学习了如何通过 ...

  7. 设计模式C++描述----20.迭代器(Iterator)模式

    一. 举例说明 我们知道,在 STL 里提供 Iterator 来遍历 Vector 或者 List 数据结构. Iterator 模式也正是用来解决对一个聚合对象的遍历问题,将对聚合的遍历封装到一个 ...

  8. 盘点飞思卡尔i.MX多媒体处理器前世今生 (转)

    现如今,移动处理器领域,大家关注最多的是德州仪器.高通.展讯.MTK,甚至包括Intel,但是请别忘记飞思卡尔,他的i.MX处理器已经发展到第六代. 那么我们今天就来盘点下i.MX的前世今生吧. i. ...

  9. 四、docker 仓库(让我们的镜像有处可存)

    前言 前面讲完了docker 镜像和容器,以及通过Dockerfile 定制属于我们自己的镜像,那那现在就是需要将我们自己定制的镜像存放到仓库中供他们使用.这一套流程才算是正式走完了.从获取镜像,操作 ...

  10. Windows机器配置启动加载器的高级选项后,机器出现蓝屏,无法RDP

    问题描述: 虚拟机重启后出现蓝屏,需要排查原因 蓝屏界面如下: 排查结果: 1.Console发现机器停留在上述蓝屏界面,按F8后,机器可以正常启动并成功连接:但通过console再次重启后,又会进入 ...