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>

 

posted @ 2019-03-29 13:44  快乐的咸鱼  阅读(4858)  评论(0编辑  收藏  举报