Vue——每次弹出el-dialog,都会执行mounted

在Vue开发中,有时需要我在同一个页面或列表中,多次加载同一个组件,但问题来了。(例如使用:新增、编辑、详情,使用弹框组件时)
该组件只在页面加载中,加载一次,后面不会再加载了,如el-dialog,解决办法如下,在el-dialog外再加一层div.

div中以v-if来控制组件el-dialog的出现与否,每次弹出el-dialog,都会执行mounted,而不加div,只会执行一次。

<div v-if="isShow">
  <ZDialog
    ref="zyxdialog"
    :title="title"
    :isShow="isShow"
    @hideDialog="isShow = false"
  >
    <NewShelf
      :shelfXX="shelfModel"
      :type="shelfType"
      v-if="isNewShelf"
      @dialogHide="dialogHide($event)"
    ></NewShelf>
  </ZDialog>
</div>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在Vue开发中,有时需要我在同一个列表中,多次加载同一个组件,但问题来了。该组件只在页面加载中,加载一次,后面不会...
    爱余星痕阅读 9,011评论 0 10
  • 深入响应式 追踪变化: 把普通js对象传给Vue实例的data选项,Vue将使用Object.defineProp...
    冥冥2017阅读 4,909评论 6 16
  • vue-cli搭建项目 确保安装了node与npm 再目标文件夹下打开终端 执行cnpm i vue-cli -g...
    Akiko_秋子阅读 3,292评论 1 22
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 3,028评论 1 4
  • 1. Vue.js介绍 Vue.js是一个轻巧、高性能、可组件化的MVVM库,同时拥有非常容易上手的API; V...
    tyu229阅读 32,658评论 1 26