Vue中关闭dialog时销毁DOM、数据等
背景:今天在写Vue时遇到一个用element-ui的dialog时,里面用路由播放视频的时候,第二个视频无法影响
多个数据共用一个dialog,但是除了第一次点击的时候,触发了引用页面的created()里方法,无论再怎么点击其它数据的方法也无法触发created(),原因应该就是DOM已经渲染完毕不会再次渲染了,所以想要用其他数据就需要销毁一下。
参考文章:https://blog.csdn.net/qq_25135655/article/details/94400290
根据原文章可知此方法可用于多种情况导致dialog内数据无法刷新的问题。
其实你已经想到了,就是隐藏dialog的时候要销毁这个dialog。 度娘后发现给dialog加v-if,在关闭dialog的时候将v-if设置为false这样el-tree会直接将其从DOM结构中抹除,到此问题解决。
<!--视频播放的弹出框-->
<el-dialog
:title="this.dialogVideo.Title"
:visible.sync="dialogVideoVisible"
width="80%"
:before-close="handleClose"
v-if="dialogVideoVisible"
>