解决父组件将子组件作为弹窗调用只执行一次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 CSS操作方法集合
Oct 31 Javascript
js 页面关闭前的出现提示的实现代码
May 25 Javascript
Javascript学习笔记之 对象篇(三) : hasOwnProperty
Jun 24 Javascript
jQuery中的read和JavaScript中的onload函数的区别
Aug 27 Javascript
jQuery滚动条插件nanoscroller使用指南
Apr 21 Javascript
JS转换HTML转义符的方法
Aug 24 Javascript
JS实现选定指定HTML元素对象中指定文本内容功能示例
Feb 13 Javascript
Vue resource中的GET与POST请求的实例代码
Jul 21 Javascript
JavaScript代码判断输入的字符串是否含有特殊字符和表情代码实例
Aug 17 Javascript
JS实现字符串去重及数组去重的方法示例
Apr 21 Javascript
详解ESLint在Vue中的使用小结
Oct 15 Javascript
vue 组件中使用 transition 和 transition-group实现过渡动画
Jul 09 Javascript
如何通过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 mssql 时间格式问题
2009/01/13 PHP
php 什么是PEAR?(第三篇)
2009/03/19 PHP
PHP获取搜索引擎关键字来源的函数(支持百度和谷歌等搜索引擎)
2012/10/03 PHP
PHP运行模式的深入理解
2013/06/03 PHP
smarty表格换行实例
2014/12/15 PHP
PHP环境中Memcache的安装和使用
2015/11/05 PHP
关于javascript document.createDocumentFragment()
2009/04/04 Javascript
javascript 写类方式之五
2009/07/05 Javascript
js函数调用常用方法详解
2012/12/03 Javascript
js和jquery中循环的退出和继续学习记录
2014/09/06 Javascript
JS+CSS实现精美的二级导航效果代码
2015/09/17 Javascript
js+html5操作sqlite数据库的方法
2016/02/02 Javascript
详解JavaScript节流函数中的Throttle
2016/07/16 Javascript
vue构建单页面应用实战
2017/04/10 Javascript
JQuery.dataTables表格插件添加跳转到指定页
2017/06/09 jQuery
Typescript 中的 interface 和 type 到底有什么区别详解
2019/06/18 Javascript
JS实现横向轮播图(初级版)
2020/06/24 Javascript
微信小程序开发(一):服务器获取数据列表渲染操作示例
2020/06/01 Javascript
react的hooks的用法详解
2020/10/12 Javascript
[39:53]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.19
2020/11/19 DOTA
[01:01:52]完美世界DOTA2联赛PWL S2 GXR vs Magma 第二场 11.25
2020/11/26 DOTA
Python中的自定义函数学习笔记
2014/09/23 Python
python2.7实现爬虫网页数据
2018/05/25 Python
浅析python中的迭代与迭代对象
2018/10/08 Python
Python File(文件) 方法整理
2019/02/18 Python
django中上传图片分页三级联动效果的实现代码
2019/08/30 Python
Python常用扩展插件使用教程解析
2020/11/02 Python
python如何构建mock接口服务
2021/01/28 Python
广州足迹信息技术有限公司Java软件工程师试题
2014/02/15 面试题
DELPHI面试题研发笔试试卷
2015/11/08 面试题
会计电算化专业毕业生求职信范文
2013/12/10 职场文书
雷锋的故事观后感
2015/06/10 职场文书
MySQL完整性约束的定义与实例教程
2021/05/30 MySQL
windows11怎么查看wifi密码? win11查看wifi密码的技巧
2021/11/21 数码科技
实例详解Python的进程,线程和协程
2022/03/13 Python
Python内置类型集合set和frozenset的使用详解
2022/04/26 Python