遇到这样一个场景，即两个不同的路由，使用同一个组件，但是切换路由时无法触发mounted方法
如图
image.png
image.png
image.png
在路由中引用的相同组件
这时会遇到mounted无法触发的问题
遇到这种问题有以下两种方法
在页面中watch $route来实现
watch: {
'$route': function() {
console.log(this.$route)
}
}
但是这里有一个问题，就是页面第一次加载的时候，还是会触发mounted, 所以如果有在页面渲染时触发的逻辑，这里需要特殊处理一下
<router-view :key="$route.fullPath"/>
image.png
设置key为$route.fullPath之后，由于两个路由的fullPath不同，组件会被强制不复用，所以将会回到正常流程，切换路由时mounted会被触发
遇到这样一个场景，即两个不同的路由，使用同一个组件，但是切换路由时无法触发mounted方法 如图 在路由中引用的...
Vue-Router路由 1路由基础 创建一个路由对象数组，每个对象分别有，path，component等属性，在...
今天学习了路由 路由 路由 路由vue-router是vue的核心组件根据不同的url访问不同页面配合单页面使用 ...
1、什么是路由？ 路由（vue-router）：是Vue的一个核心插件，可以根据不同的url访问不同的页面，还可以...
路由：vue-router (1):路由是vue的核心插件 （2）：可以根据不同的url访问不同的页面 （3）：可...
关于路由 在router.js中引入vue和vue-router 路由模式 前端路由就是一个前端不同页面的状态管理...
Vue-Router路由懒加载（利用Webpack的代码切割） 把不同路由对应的组件分割为不同的代码块，当路由被访...
一、vue-router 路由基本加载 路由，通俗地来讲就是输入不同的网址，加载不同的组件。 进入项目目录 安装 ...
路由（vue-router）是vue的工具库 vue.js路由允许我们通过不同的URL访问不同的页面 Vue.js...
vue路由--- SPA应用，单页面应用vue-resouce 交互vue-router 路由根据不同url地址...
本文标题：vue-router两个不同的路由共用一个component的问
本文链接：https://www.haomeiwen.com/subject/tfxbpctx.html
网友评论