vue 使用同一组件,切换时不触发created、mounted钩子
两个页面参数不同使用同一组件,默认情况下当这两个页面切换时并不会触发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钩子的更多相关文章
- Vue学习之组件切换及父子组件小结(八)
一.组件切换: 1.v-if与v-else方式: <!DOCTYPE html> <html lang="en"> <head> <met ...
- Vue系列之 => 组件切换
组件切换方式一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- vue 动态创建组件(运行时创建组件)
function mountCmp (cmp, props, parent) { if (cmp.default) { cmp = cmp.default } cmp = Vue.extend(cmp ...
- Vue中在组件销毁时清除定时器(setInterval)
在mounted中创建并执行定时器,然后在beforeDestroy或者destroyed中清除定时器 <template> <div class="about" ...
- vue调用子组件方法时,参数传不过去
有可能是因为子组件方法用了 async await 子组件去掉async就好了
- Vue内置组件[回顾]
1.动态组件 在某些场景,往往需要我们动态切换页面部分区域的视图,这个时候内置组件component就显得尤为重要. component接收一个名为is的属性,is的值应为父组件中注册过的组件的名称, ...
- vue实现tab选项卡切换
上代码: <template> <div class="push"> //点击按钮 <div class="tab&qu ...
- vue -vantUI tab切换时 list组件不触发load事件解决办法
最近由于公司项目需要,用vue写了几个简单的页面.用到了vantUI List 列表 瀑布流滚动加载,用于控制长列表的展示 当列表即将滚动到底部时,会触发事件并加载更多列表项. (页面加载完成后默认会 ...
- vue路由切换时内容组件的滚动条回到顶部
在使用vue的时候会出现切换路由的时候滚动条保持在原来的位置,要切换路由的时候滚动条回到顶部才有更好的用户体验 1.当页面整体都要滚动到顶部的情况 router.afterEach(() => ...
随机推荐
- TF.LSTM实现
感悟:耗时最多的就是数据格式整理,其本身并不复杂 NN-LSTM-NN-SOFTMAX 数据格式:batch_size =>批大小,n_steps=>要建立多少lstm 0.原始输入数据格 ...
- ES6学习笔记(十二)异步解决方案Promise
1.Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大.它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了P ...
- 【BZOJ 1051】[HAOI2006]受欢迎的牛
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] Tarjan算法强连通缩点 . 最后出度为0的点. 如果只有一个. 那么这个"大点"所包含的点的个数就是答案了. ...
- Xwiki平台Windows搭建(Tomcat7 + XWiki6.2 + MySQL5.5)
背景介绍 国内xwiki安装使用资料较少,根据自己使用xwiki经验,总结出来,供参考,同时希望感兴趣的朋友能够一起讨论,XWiki是一个强大的Java开源的Wiki引擎. 它支持一些受欢迎的特性如: ...
- 使用ThoughtWorks.QRCode生成二维码
新建Windows应用程序,加入引用ThoughtWorks.QRCode.dll,编写代码生成二维码. using System; using System.Drawing; using Syste ...
- Android Volley 具体解释 Google公布的一套用于网络通信的工具库
下载地址:git clone https://android.googlesource.com/platform/frameworks/volley 或 : https://github.com/mc ...
- android动画-拖动
先上图看效果 实质上说是动画有点不妥,确切的说应该是手势的处理,废话不多说看代码 SimpleDragSample.java public class SimpleDragSample extends ...
- iOS 一个ViewController上显示2个tableView的方法
1.在StoryBoard上创建2个tableView,并用autolayout约束. 2.在ViewController上拖进来. @property (weak, nonatomic) IBOut ...
- QThread 爬坑之旅(三种办法解决QObject: Cannot create children for a parent that is in a different thread)
Cannot create children for a parent that is in a different thread. 在Qt的官方文档,大家知道有两种方式使用QThread. You ...
- Centos7 zabbix3.4.6的安装部署 (一)
部署zabbix主要为了监控日常主机.服务器.Web服务器.数据库.路由器.交换机等日常设备,功能强大,稳定性好 现在通过使用虚拟机VM搭建的Centos7部署zabbix服务 实现简单监控功能 本章 ...