因为router-view传参问题无法解决，比较麻烦。

所以我采取的是@click+this.router.push来跳转

但是现在的问题是跳转后，url改变了，但是页面的数据没有重新渲染，要刷新才可以。

有几种办法，用route.go(0)这种方法虽然可以跳转，但是很不友好，要重新加载，变白。

问了群查了很久，无意中发现一个完美切合的

https://www.jb51.net/article/151984.htm

原理就是通过v-if去销毁再生成一次dom

然后跟着做，首先将app.vue里面修改一下

然后在需要用到的页面用即可

vue多个路由复用同一个组件的跳转问题（this.router.push）的更多相关文章

  1. Vue 实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案

    Vue实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案   by:授客 QQ:1033553122   开发环境   Win 10   Vue 2.9.6   node-v ...

  2. vue 2.0 路由切换以及组件缓存源代码重点难点分析

    摘要 关于vue 2.0源代码分析,已经有不少文档分析功能代码段比如watcher,history,vnode等,但没有一个是分析重点难点的,没有一个是分析大命题的,比如执行router.push之后 ...

  3. vue 同一个组件的跳转， 返回时保留原来的下拉位置

    1,需求分析 公司的项目有这样一个需求: 同一个list组件,根据传过来的listId渲染成多个页面,每个页面都可以下拉.在返回到不同的list页面时,要保留当时下拉的位置. 说的我自己都有点懵逼了, ...

  4. vue多个路由使用同一个页面,通过name判断参数,渲染页面数据

    项目中,发现有多个页面的数据内容相同,只是请求数据的参数不同,就可以使用同一个组件来渲染 这里的客户列表 / 我负责的 / 我参与的 都使用同一个组件,不同点在请求数据的参数 可以看到,通过钩子函数, ...

  5. vue: 关于多路由公用模板，导致组件内数组缓存问题

    当多个路由复用同一个模板,此时在这几个路由间切换,模板并不会重新挂载.针对这个情况,我们需要在当前逻辑内对路由做监听,在发生变化时更新对应属性,已满足需求. 但是,在实现的过程中会遇到如下情况: 如图 ...

  6. vue篇之路由详解

    一.vue路由传参的几种方式 1.声明式 router-link 父组件:<router-link :to="`/path/${id}`"><router-lin ...

  7. vue中this.$router.push()路由传值和获取的两种常见方法

    1.路由传值   this.$router.push() (1) 路由跳转使用router.push()方法,这个方法会向history栈添加一个新纪录,所以,当用户点击浏览器后退按钮时,会回到之前的 ...

  8. vue通过ID（参数）修改URL复用同一个页面（组件）不重新加载的问题

    项目中经常会用到同一个页面,结构是相同的,我只是在vue-router中通过添加参数的方式来区分状态,参数可以在页面跳转时带上params,或者query,但是有一个问题,即使我们修改了参数,URL也 ...

  9. Vue系列（三）：组件及数据传递、路由、单文件组件、vue-cli脚手架

    上一篇:Vue系列(二):发送Ajax.JSONP请求.Vue生命周期及实例属性和方法.自定义指令与过渡 一. 组件component 1. 什么是组件? 组件(Component)是 Vue.js ...

随机推荐

  1. 【实践】如何利用tensorflow的object_detection api开源框架训练基于自己数据集的模型（Windows10系统）

    如何利用tensorflow的object_detection api开源框架训练基于自己数据集的模型(Windows10系统) 一.环境配置 1. Python3.7.x(注:我用的是3.7.3.安 ...

  2. JavaScript图形实例：递归生成树

    观察自然界中树的分叉,一根主干生长出两个侧干,每个侧干又长出两个侧干,以此类推,便生长出疏密有致的结构.这样的生长结构,使用递归算法可以模拟出来. 例如,分叉的侧干按45°的偏转角度进行生长的递归示意 ...

  3. PL/SQL 美化器&规则解释&优化代码

    前言 PLSQL有非常强大的自定义设置功能,比如美化文件规则, 使用者可以自行定义编辑规则,以便更好的优化SQL语句,增加可读性. 例如以下的部分代码,又长,分段不好,空格太多,结构散乱,还没有注释. ...

  4. 「JLOI2015」城池攻占 可并堆

    传送门 分析 如果直接暴力枚举的话肯定会超时 我们可以从下往上遍历,维护一个小根堆 每次到达一个节点把战败的骑士扔出去 剩下的再继续向上合并,注意要维护一下其实的战斗力 可以像线段树那样用一个lazy ...

  5. sql语句-如何在SQL以一个表中的数据为条件据查询另一个表中的数据

    select *from 表2where 姓名 in (select 姓名from 表1where 条件) 这个就是用一个表的查询结果当作条件去查询另一个表的数据

  6. setTimeout还有第三个参数

    今天才发现setTimeout还有第三个参数. for (var i = 0; i< 10; i++){ setTimeout((i) => { console.log(i); }, 10 ...

  7. Scala 基础（六）：Scala变量 (三) 标识符

    1 标识符概念 1) Scala 对各种变量.方法.函数等命名时使用的字符序列称为标识符 2) 凡是自己可以起名字的地方都叫标识符 2 标识符的命名规则 Scala中的标识符声明,基本和Java是一致 ...

  8. Python并发编程04 /多线程、生产消费者模型、线程进程对比、线程的方法、线程join、守护线程、线程互斥锁

    Python并发编程04 /多线程.生产消费者模型.线程进程对比.线程的方法.线程join.守护线程.线程互斥锁 目录 Python并发编程04 /多线程.生产消费者模型.线程进程对比.线程的方法.线 ...

  9. 深度学习论文翻译解析（十）：Visualizing and Understanding Convolutional Networks

    论文标题:Visualizing and Understanding Convolutional Networks 标题翻译:可视化和理解卷积网络 论文作者:Matthew D. Zeiler  Ro ...

  10. DQL：查询表中的记录

    DQL:查询表中的记录 * select * from 表名; 1. 语法: select 字段列表 from 表名列表 where 条件列表 group by 分组字段 having 分组之后的条件 ...