两个页面参数不同使用同一组件,默认情况下当这两个页面切换时并不会触发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. ubuntu 18.04网卡命名规则改回传统的ethx

    自15版本开始网卡命名规则就不叫eth0了.而是用可预期网络接口设备名称的命名规则,比如网卡名为enp3s0 . 如果想要变回ethx也是可以的,参考以下步骤: 1.编辑/etc/default/gr ...

  2. 阿里云上如何找到虚拟主机和用户名登录FileZilla软件?

    0.少玩游戏 1.登录阿里云官网 :https://www.aliyun.com/ 2.点击自己的旁边的名称进入进入自己的页面 3.购买的域名和主机会在这里显示,点击域名与网站(万网)>云虚拟主 ...

  3. 再谈CLR查找和加载程序集的方式

    原文:再谈CLR查找和加载程序集的方式 这是一个老问题,以前也有朋友写过一些文章介绍,但可能还不是很全面.我也多次被人问到,这里结合案例再次谈谈,希望对大家有所帮助. 本文范例代码可以通过这里下载 h ...

  4. Android通过XML来定义Menu

    直接在代码中添加菜单项,给菜单项分组等,这是比较传统的做法,它存在着一些不足.比如说,为了响应每个菜单项,我们需要用常量来保存每个菜单项的ID等.为此,Android提供了一种更好的方式,就是把men ...

  5. hiho 1055 刷油漆 树形dp

    一个简单的树上的背包问题. 代码: #include <iostream> #include <cstdio> #include <cstring> #includ ...

  6. 洛谷 P1056 排座椅

    P1056 排座椅 题目描述 上课的时候总会有一些同学和前后左右的人交头接耳,这是令小学班主任十分头疼的一件事情.不过,班主任小雪发现了一些有趣的现象,当同学们的座次确定下来之后,只有有限的D对同学上 ...

  7. 跨域post 及 使用token防止csrf 攻击

    环境: 后台使用的python - flask 前台使用angular框架 1.一个跨域post的样例: 跨域post有多种实现方式: 1.CORS:http://blog.csdn.net/hfah ...

  8. 2015北京网络赛 J Scores bitset+分块

    2015北京网络赛 J Scores 题意:50000组5维数据,50000个询问,问有多少组每一维都不大于询问的数据 思路:赛时没有思路,后来看解题报告也因为智商太低看了半天看不懂.bitset之前 ...

  9. 巧用Linux 架设TFTP Server备份路由器的配置文件

    本文首发<网管员世界>  转载本文站点: ChinaITLAB TFTP (普通文件传输协议或一般文件传输协议) 大家一定记得在2003年8月12日全球爆发冲击波(Worm.Blaster ...

  10. 动态调用WebService-获取天气

    string url = "http://www.webxml.com.cn/WebServices/WeatherWebService.asmx"; string[] args ...