问题:  导航栏的地址发生改变但是页面却不刷新  (用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. JVM 知识点补充——永久代和元空间

    之前已经讲过了不少有关 JVM 的内容,今天准备将之前没有细讲的部分进行补充,比如:永久代和元空间. 永久代 Java 的内存中有一块称之为方法区的部分,在 JDK8 之前, Hotspot 虚拟机中 ...

  2. 关于微信oauth登录的坑

    这是实习公司里微信公众号的一个小项目,用的是ssm.问题是获取用户openid为空. 分析下步骤 首先用户点击微信公众号按钮 访问微信服务器获取code 跳转到项目url 拿code访问微信服务器,获 ...

  3. Java基础(二十六)Java IO(3)字节流(Byte Stream)

    字节流是以字节为单位来处理数据的,由于字节流不会对数据进行任何转换,因此用来处理二进制的数据. 一.InputStream类与OutputStream类 1.InputStream类是所有字节输入流的 ...

  4. django-模板之模板变量(二)

    将views中的变量传递给html界面 book/views.py from django.views import View from django.shortcuts import render ...

  5. 使用MySQL,SQL_MODE有哪些坑,你知道么?

    SQL_MODE是MySQL中的一个系统变量(variable),可由多个MODE组成,每个MODE控制一种行为,如是否允许除数为0,日期中是否允许'0000-00-00'值. 为什么需要关注SQL_ ...

  6. Nexus 离线更新中央仓库索引

    nexus可以在线更新中央仓库索引,但是更新速度慢,而且很有可能下载的索引不全.下面介绍一种离线更新中央仓库索引的方式,速度快并且可靠. 1.访问http://repo.maven.apache.or ...

  7. 安装Java环境

    一.下载JDK https://www.oracle.com/technetwork/java/javase/downloads/index.html 二.exe安装 默认路径 C:\Program ...

  8. [wcp部署]Linux(Ubuntu)安装部署WCP

    1.安装JAVA运行环境 配置环境变量及安装jdk mkdir /usr/local/java tar -zxvf jdk-8u31-linux-x64.gz #解压jdk包 mv jdk1.8.0_ ...

  9. hack the box -- sizzle 渗透过程总结,之前对涉及到域内证书啥的还不怎么了解

     把之前的笔记搬运过来 ---   1 开了443,用smbclient建立空连接查看共享 smbclient -N -L \\\\1.1.1.1 Department Shares Operatio ...

  10. 如何进行kubernetes问题的排障

    排障的前置条件 k8s的成熟度很高,伴随着整个项目的扩增,以及新功能和新流程的不断引入,也伴随这产生了一些问题.虽然自动化测试可以排除掉大部分,但是一些复杂流程以及极端情况却很难做到bug的完全覆盖. ...