解决父组件将子组件作为弹窗调用只执行一次created的问题


Posted in Javascript onJuly 24, 2020

1、问题原因

因为第一调用渲染子组件后,不再对子组件的created进行调用

2、解决方法

用v-if将子组件包裹起来,因为v-if=false时可以将子组件销毁掉,再次调用时重新渲染

3、上图

解决父组件将子组件作为弹窗调用只执行一次created的问题

解决父组件将子组件作为弹窗调用只执行一次created的问题

初始默认dialogVisible1=false,当执行打开窗口的操作时dialogVisible1为true,当关闭窗口时dialogVisible1=false,从而每一次进入弹窗都会重新渲染整个子组件。

补充知识:vue如何每次打开子组件弹窗都进行初始化

:visible.sync 与 v-if同时使用即可。

解决父组件将子组件作为弹窗调用只执行一次created的问题

以上这篇解决父组件将子组件作为弹窗调用只执行一次created的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 匿名调用实现代码
Jun 19 Javascript
对字符串进行HTML编码和解码的JavaScript函数
Feb 01 Javascript
5款JavaScript代码压缩工具推荐
Jul 07 Javascript
javascript原型链继承用法实例分析
Jan 28 Javascript
jquery实现TAB选项卡鼠标经过带延迟效果的方法
Jul 27 Javascript
jquery实现选中单选按钮下拉伸缩效果
Aug 06 Javascript
详解利用exif.js解决ios手机上传竖拍照片旋转90度问题
Nov 04 Javascript
javascript阻止事件冒泡和浏览器的默认行为
Jan 21 Javascript
React Native中导航组件react-navigation跨tab路由处理详解
Oct 31 Javascript
layerUI下的绑定事件实例代码
Aug 17 Javascript
vue、react等单页面项目部署到服务器的方法及vue和react的区别
Sep 29 Javascript
jQuery 查找元素操作实例小结
Oct 02 jQuery
如何通过vscode运行调试javascript代码
Jul 24 #Javascript
解决vue做详情页跳转的时候使用created方法 数据不会更新问题
Jul 24 #Javascript
js实现验证码功能
Jul 24 #Javascript
解决VUE自定义拖拽指令时 onmouseup 与 click事件冲突问题
Jul 24 #Javascript
深入了解Vue.js 混入(mixins)
Jul 23 #Javascript
JS实现简单移动端鼠标拖拽
Jul 23 #Javascript
JS使用Chrome浏览器实现调试线上代码
Jul 23 #Javascript
You might like
PHP 遍历文件实现代码
2011/05/04 PHP
Linux下创建nginx脚本-start、stop、reload…
2014/08/03 PHP
PHP面向对象之领域模型+数据映射器实例(分析)
2017/06/21 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
juqery 学习之四 筛选查找
2010/11/30 Javascript
Jquery中显示隐藏的实现代码分析
2011/07/26 Javascript
jquery 插件学习(一)
2012/08/06 Javascript
Node.js编程中客户端Session的使用详解
2015/06/23 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
2015/09/10 Javascript
javascript动态生成树形菜单的方法
2015/11/14 Javascript
js原型链与继承解析(初体验)
2016/05/09 Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
2016/05/10 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
2016/11/18 Javascript
原生JS实现简单放大镜效果
2017/02/08 Javascript
干货!教大家如何选择Vue和React
2017/03/13 Javascript
JS中定位 position 的使用实例代码
2017/08/06 Javascript
JavaScript 数组的进化与性能分析
2017/09/18 Javascript
详解vue 数组和对象渲染问题
2018/09/21 Javascript
原生JS实现的自动轮播图功能详解
2018/12/28 Javascript
JS将指定的某个字符全部转换为其他字符实例代码
2020/10/13 Javascript
Nodejs在局域网配置https访问的实现方法
2020/10/17 NodeJs
[56:47]Ti4 循环赛第三日 iG vs Liquid
2014/07/12 DOTA
Python实现批量读取word中表格信息的方法
2015/07/30 Python
解决Tensorflow使用pip安装后没有model目录的问题
2018/06/13 Python
Django之模型层多表操作的实现
2019/01/08 Python
PYTHON绘制雷达图代码实例
2019/10/15 Python
Python 3.8正式发布重要新功能一览
2019/10/17 Python
Django使用消息提示简单的弹出个对话框实例
2019/11/15 Python
HTML5 manifest离线缓存的示例代码
2018/08/08 HTML / CSS
美国亚洲时尚和美容产品的一站式网上商店:Stylevana
2019/09/05 全球购物
Java方面的关于数组和继承的笔面试题
2015/09/18 面试题
DOM和JQuery对象有什么区别
2016/11/11 面试题
基于Python 函数和方法的区别说明
2021/03/24 Python
市场营销专业推荐信
2013/11/03 职场文书
自荐信格式简述
2014/01/25 职场文书
小区门卫管理制度
2014/01/29 职场文书