vue 弹窗调用父窗口函数

 

目前再用 ant D 设计开发页面，使用a-model对话框弹出后，内容嵌套了一个自定义组件，且对话框去掉了原有按钮，改为自定义，导致无法关闭当前窗口。

footer：设置去掉底部“确定”，“取消”按钮为空
@cancel：取消事件

 1 <!-- 弹窗 -->
 2     <j-modal
 3       :visible.sync="jmodal_entity.visible"
 4       :title="jmodal_entity.title"
 5       :keyboard="true"
 6       width="90%"
 7       switchFullscreen
 8       :fullscreen.sync="jmodal_entity.fullscreen"
10       @cancel="handleCancel"
11       footer
12     >
13       <applyForm :record="recordData" @cancel="handleCancel" />
14     </j-modal>

 

在applyForm 使用时，传入函数。

applyForm中调用该函数的方法为
this.$emit('cancel')
通过cancel即可调用到父界面的handleCancel函数，即可操作a-model标签的visable属性，使其关闭弹窗。

 

posted @ 2020-07-11 15:37  家伙L  阅读(1438)  评论(0)  编辑  收藏  举报