iview Model对话框点击确定后iview会自动关闭窗口
问题描述:在某个页面需打开一个Model,然后这个Model里有一个Form表单,点击确定时我需要先校验表单数据是否输入正确,不确定则不希望关闭窗口;(问题是:只要点击确认 loading :false 情况下iview默认就把this.visible = false 窗口就关闭了)
做法是:
Form校验不通过,则:
this.$refs.model.visible = true;
这样窗口就不会关闭;
实例:
<template> <div> <Modal title="对话框" v-model="modal":maskClosable="false" :loading="modalLoading" @on-ok="ok" ref="modal"> <div class="ivu-modal-confirm-body" style="padding-left:0px;"> </div> </Modal> <button style="padding: 20px" @click="open">打开对话框</button> </div> </template> <script> export default { computed: { }, data() { return { modalLoading: true, modal: false, } }, methods:{ open(){ this.modal = true; }, ok () { if (1) { this.$refs.modal.visible = true; this.modalLoading = false;
this.open(); return } this.modal = false }, } } </script>