问题
在最近的项目中,发现dialog的updated()函数在未打开dialog时就已经执行,在打开dialog后则不会再执行
原因
因为dialog在的关闭是通过设置style:"display:none;"
来进行隐藏,所以当主页中发生变化时(因为我dialog中的数据与主页数据相关),dialog就已经执行updated()函数了
解决方案
在dialog外层套上一个div
并且设置v-if
判断语句
<div v-if="enlarge">
<el-dialog :visible.sync="enlarge">
</el-dialog>
</div>
另外,因为项目中需要用到很多的dialog,所以我一开始的写法是将所有的dialog都放在一个Dialog.vue文件中去写,结果发现到后面同一个dialog会出现两次并进行覆盖。所以,大家可以建一个Dialog文件夹,在里面细分每一个dialog.vue文件。共勉。