两个页面参数不同使用同一组件,默认情况下当这两个页面切换时并不会触发created或者mounted钩子。

方法一:通过watch $route的变化来做处理

watch: {
$route() {
if (this.$route) {
...
}
}
},

方法二:在 router-view上加上一个唯一的key,来保证路由切换时都会重新渲染触发钩子

<router-view :key="key"></router-view>

computed: {
key() {
return this.$route.name !== undefined? this.$route.name + +new Date(): this.$route + +new Date()
}
}

vue 使用同一组件,切换时不触发created、mounted钩子的更多相关文章

  1. Vue学习之组件切换及父子组件小结(八)

    一.组件切换: 1.v-if与v-else方式: <!DOCTYPE html> <html lang="en"> <head> <met ...

  2. Vue系列之 => 组件切换

    组件切换方式一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  3. vue 动态创建组件(运行时创建组件)

    function mountCmp (cmp, props, parent) { if (cmp.default) { cmp = cmp.default } cmp = Vue.extend(cmp ...

  4. Vue中在组件销毁时清除定时器(setInterval)

    在mounted中创建并执行定时器,然后在beforeDestroy或者destroyed中清除定时器 <template> <div class="about" ...

  5. vue调用子组件方法时,参数传不过去

    有可能是因为子组件方法用了 async  await 子组件去掉async就好了

  6. Vue内置组件[回顾]

    1.动态组件 在某些场景,往往需要我们动态切换页面部分区域的视图,这个时候内置组件component就显得尤为重要. component接收一个名为is的属性,is的值应为父组件中注册过的组件的名称, ...

  7. vue实现tab选项卡切换

    上代码: <template>   <div class="push">     //点击按钮     <div class="tab&qu ...

  8. vue -vantUI tab切换时 list组件不触发load事件解决办法

    最近由于公司项目需要,用vue写了几个简单的页面.用到了vantUI List 列表 瀑布流滚动加载,用于控制长列表的展示 当列表即将滚动到底部时,会触发事件并加载更多列表项. (页面加载完成后默认会 ...

  9. vue路由切换时内容组件的滚动条回到顶部

    在使用vue的时候会出现切换路由的时候滚动条保持在原来的位置,要切换路由的时候滚动条回到顶部才有更好的用户体验 1.当页面整体都要滚动到顶部的情况 router.afterEach(() => ...

随机推荐

  1. codeforces 445 B DZY Loves Chemistry【并查集】

    题意:给出n种化学物质,其中m对会发生化学反应,每次加入化学物质进去的时候, 如果有能够和它发生反应的,危险值就乘以2,问怎样的放入顺序使得危险值最大 将这m对会反应的用并查集处理,统计每个连通块里面 ...

  2. UI Framework-1: Browser Window

    Browser Window The Chromium browser window is represented by several objects, some of which are incl ...

  3. mongodb 主从

    mongodb 主从 因为条件限制我们把主从放在一台服务器上面 相关参数 在启动从的时候可以增加以下参数 --autoresync 当发现从服务器的数据不是最新时,开始从主服务器请求同步数据 --sl ...

  4. ArchLinux 调节屏幕亮度和音量大小

    我使用的是dwm,所以这种琐碎小事还要我们亲自动手, 以后考虑做个脚本,把声音调节.屏幕亮度什么的统统塞进去 屏幕亮度 # 查看亮度最大值 cat /sys/class/backlight/intel ...

  5. 首家5G体验厅在深圳建成

    日前,深圳移动卓越时代营业厅推出5G全方位体验活动,让市民亲身感受5G时代到来.据悉,十大5G展示项目生动展现移动5G带来的生活巨变与产业升级,为5G发展汇聚各界力量加速创新落地. 现场有市民表示,5 ...

  6. 打包maven项目

    使用插件maven-jar-plugin打包自己的项目,为了打包后点击jar文件可以直接运行,需要指定入口类和classpath.使用maven-dependency-plugin插件打包项目的依赖& ...

  7. Myeclipse学习总结(4)——Eclipse常用开发插件

    (1)    AmaterasUML         介绍:Eclipse的UML插件,支持UML活动图,class图,sequence图,usecase图等:支持与Java class/interf ...

  8. 对GPDB查询计划的Motion结点的理解

    GPDB在进行join查询时,可能会产生Motion结点 根据官方文档,总共有这几种Motion: redistribute 重分布(用hash取模的方法把join字段重分布到各个segment,相当 ...

  9. poj 1681 Painter&#39;s Problem(高斯消元)

    id=1681">http://poj.org/problem? id=1681 求最少经过的步数使得输入的矩阵全变为y. 思路:高斯消元求出自由变元.然后枚举自由变元,求出最优值. ...

  10. 我持续推动Rust语言支持Windows XP系统

    前言 Rust好像长期以来不支持Windows XP系统.有不少用户发帖提议官方支持XP,基本上都被Rust官方开发人员明白的拒绝了.他们的对话大致上是以这种形式開始和结束的(当中乙方代表官方及其拥趸 ...