两个页面参数不同使用同一组件,默认情况下当这两个页面切换时并不会触发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. 爬虫--pyquery使用

    强大又灵活的网页解析库. 初始化   字符串初始化 html = ''' <div> <ul> <li class="item-0">first ...

  2. 服务器TCP连接中 TIME_WAIT 状态过多

    今天查看服务器的TCP连接数,发现其中 TIME_WAIT 状态的太多了: # netstat -n | awk '/^tcp/ {++S[$NF]} END {for(a in S) print a ...

  3. NOIP 2017 逛公园 记忆化搜索 最短路 好题

    题目描述: 策策同学特别喜欢逛公园.公园可以看成一张N个点MM条边构成的有向图,且没有 自环和重边.其中1号点是公园的入口,N号点是公园的出口,每条边有一个非负权值, 代表策策经过这条边所要花的时间. ...

  4. 对比学习:《深度学习之Pytorch》《PyTorch深度学习实战》+代码

    PyTorch是一个基于Python的深度学习平台,该平台简单易用上手快,从计算机视觉.自然语言处理再到强化学习,PyTorch的功能强大,支持PyTorch的工具包有用于自然语言处理的Allen N ...

  5. Eclipse StartExplorer插件

    http://www.cnblogs.com/wuxiang/p/5489961.html

  6. CountDownLatch &amp; CyclicBarrier源代码实现解析

    CountDownLatch CountDownLatch同意一条或者多条线程等待直至其他线程完毕以系列的操作的辅助同步器. 用一个指定的count值对CountDownLatch进行初始化. awa ...

  7. 翻翻git之---炫酷的自己定义翻滚View TagCloudView

    转载请注明出处:王亟亟的大牛之路 周一好,又到了每周最困的一天.近期都被啮齿类动物搞的累死,废话不多,今天上一个自己定义的ViewGroup实现一个3D球形集合. 效果图: 效果还不错,能够作为短小文 ...

  8. Codeforces 11B Jumping Jack(数学)

    B. Jumping Jack time limit per test 1 second memory limit per test 64 megabytes input standard input ...

  9. javascript对象如何使用

    javascript对象如何使用 一.总结 一句话总结:JavaScript 中的所有事物都是对象:字符串.数值.数组.函数... 因为函数是对象,所以自定义对象的创建中有种方法就是函数 1.js中的 ...

  10. POJ 1895 分层图网络流+输出路径

    题意: 题目描述:在公元3141年人类的足迹已经遍布银河系.为了穿越那巨大的距离,人类发明了一种名为超时空轨道的技术.超时空轨道是双向的,连接两个星系,穿越轨道需要一天的时间.然而这个轨道只能同时给一 ...