问题:  导航栏的地址发生改变但是页面却不刷新  (用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. 【网络安全】Dos攻击科普文

    目录 DOS攻击 什么是DOS攻击 攻击手段分类 具体的攻击方式举例 优秀博客参考 DDOS攻击 DOS攻击 什么是DOS攻击 DOS是Denial of Service的简称,用中文简单翻译就是拒绝 ...

  2. SQL查询选修了所有课程的学生姓名

    select sname from student where not exists (select * from course where not exists   (select * from s ...

  3. 最全的access2013教程 access 2010教程 access 2007教程 Access 2003教程

    最全的access2013教程 access 2010教程 access 2007教程 Access 2003教程 都在这个access中国网站里 http://www.office-cn.net/o ...

  4. linux sudo root 权限绕过漏洞(CVE-2019-14287)

    0x01 逛圈子社区论坛 看到了 linux sudo root 权限绕过漏洞(CVE-2019-14287) 跟着复现下 综合来说 这个漏洞作用不大  需要以下几个前提条件 1.知道当前普通用户的密 ...

  5. 查找一个卷对应的osd

    1.首先找到卷的id: 2.使用rados命令找到卷上面的对象数据: 3.通过ceph osd map命令可以查询到对象对应的pgid及pg对应的osd:

  6. 爬虫之scrapy简单案例之猫眼

    在爬虫py文件下 class TopSpider(scrapy.Spider): name = 'top' allowed_domains = ['maoyan.com'] start_urls = ...

  7. vue中组件的data为什么是一个函数

    1. 前言 在学习vue的时候,一直纳闷一件事:组件的data数据为什么必须要以函数返回的形式,为什么不是简单的对象形式呢?遂带着问题去翻官方文档,文档中自然也写明了这么做的原因,本篇博文以官方文档给 ...

  8. STL&&用法集合

    .....STL是c++里很强势很好用的一系列容器(函数)之类的,之前一直不太会用,所以总是暴毙....想着快比赛了,是时候理一下这些东西了. -1.pair 存放两个基本元素的东西 定义方法: pa ...

  9. 前端Vue中常用rules校验规则

    前提 在 vue开发中,难免遇到各种表单校验,这里整理了网络上和自己平时高频率用到的一些校验方法.如果错误欢迎指出,后期不断补充更新. 1.是否合法IP地址 export function valid ...

  10. C 总结 | 复习注意点

    1.1 C预处理 常见错误 预处理错误 #include "" 和 <> 使用错误 "No such....." 更改“” 或者<> 或 ...