因为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. 半导体质量管理_eCAP LineWorks SPACE eCAP(电子OCAP)

    用于设计和实施纠正措施的自动化工作流程 以电子方式管理纠正措施的工作流程 LineWorks SPACE的此附加程序提供了设计和自动实施纠正措施(电子纠正措施计划,eCAP)的工作流程.这样可以确保您 ...

  2. Linux下Jmeter+nmon+nmon analyser实现性能监控及结果分析

    一.概述 前段时间讲述了Jmeter利用插件PerfMon Metrics Collector来监控压测过程中服务器资源的消耗,一个偶然机会,我发现nmon这个 工具挺不错,和Jmeter插件比起来, ...

  3. mongodb 3.x以上版本与mongodb 2.x版本语法区别

    2.x const MongoClient = require('mongodb').MongoClient; const url = 'mongodb://localhost:27017/test' ...

  4. 手写SpringMVC框架(三)-------具体方法的实现

    续接前文 手写SpringMVC框架(二)结构开发设计 本节我们来开始具体方法的代码实现. doLoadConfig()方法的开发 思路:我们需要将contextConfigLocation路径读取过 ...

  5. python unittest自动测试框架

    编写函数或者类时进行测试,确保代码正常工作 python  unittest 模块提供了代码测试工具.按照定义测试包括两部分:管理测试依赖库的代码(称为‘固件’)和测试本身. 单元测试用于核实函数的某 ...

  6. pycharm中连接MySql出现 Exception in thread "main" java.lang.ClassNotFoundException: com.mysql.jdbc.的错误解决

    具体异常如下: 这个异常特别烦人,是mysql连接驱动的问题,可以用二步解决: 第一步 从网上下载驱动,从mysql-connector-java_8.0.16-1ubuntu16.04_all.de ...

  7. Web前端年后跳槽面试复习指南

    <pliga' 1,="" 'onum'="" 'kern'="" 1;="" margin:="&qu ...

  8. 基于图嵌入的高斯混合变分自编码器的深度聚类(Deep Clustering by Gaussian Mixture Variational Autoencoders with Graph Embedding, DGG)

    基于图嵌入的高斯混合变分自编码器的深度聚类 Deep Clustering by Gaussian Mixture Variational Autoencoders with Graph Embedd ...

  9. 接口测试基础——session认证和token认证

    总算是把这个过程理清楚了,现在我们的思路是:what?why?How?,实际上这些个机制产生的内部逻辑是从下至上的的:遇到问题了,想办法解决,总结归纳并取名.从解决一些小问题开始生长,不断打补丁直至完 ...

  10. Tomcat双击startup.bat闪退的原因及解决方式

    很久不碰Tomcat了,最近因为种种原因需要重新投入到Java Web的怀抱,所以又重新接触了Tomcat 我下载了tomcat的压缩包将其解压缩到某个位置,我这里是D盘下的tomcat文件夹中,但是 ...