阻止iview-modal确定时关闭

版权声明：每次关键时刻我都会掉链子，我知道重要时刻我都会发挥失常，所以我会付出150%的努力，即使只能发挥60%水平，也能拿到90分！ https://blog.csdn.net/qq_16371909/article/details/82800427

开发后台管理项目时使用了iview框架，实现模态窗的时候用到其Modal 对话框组件，复制粘贴官方代码时。遇到如下问题：只要点击确定按钮，modal永远会关闭，return都阻止不了其关闭。
下面代码中我做了一个数据提交操作，在提交前要判定数据是否合法，不合法就提示用户修改，但我在@on-ok="ok"的ok方法里写return没有任何卵用，只要点击了确定按钮，modal总是会关闭。

<template>
	<Modal
    	v-model="modal1"
    	title="标题"
        @on-ok="ok"
        @on-cancel="cancel">
    		<input type=text  v-model='someData' />
    		<p>这个模态框里面我做了一个数据提交操作，希望点击确定按钮的时候先校验有没有输入</p>
	</Modal>
</template>

<script>
    export default {
        data () {
            return {
                modal1: false,
                someData:''
            }
        },
        methods: {
            ok () {
            	if(!this.someData){
            	 	this.$Message.info('该输入框不可以为空');
			        return;//仍然阻止不了模态窗关闭
			     }   
            },
            cancel () {
                this.$Message.info('Clicked cancel');
            }
        }
    }
</script>

千万不要跟我讲说给Modal添加属性loading后，点击确定按钮对话框不会自动消失，并显示 loading 状态，需要手动关闭对话框，常用于表单提交。这个方法很机车唉!!!
我找到一个简单方便的方法，使用slot插入自定义的底部按钮组就不会存在上述不可阻断的问题了。代码如下：

<Modal title="退款" v-model="showRejectModal">
   <!--重点就是下面的代码了-->
   <div slot="footer">
   	<Button type="text" size="large" @click="showRejectModal=false">取消</Button>
   	<Button type="primary" size="large" @click="doSomething">确定</Button>
   </div>
</Modal>

这样我们在doSomething方法里面做条件判定，不满足的时候return就可以阻止数据提交，给出提示，并且不会关闭modal，你可以通过控制绑定的showRejectModal的值来控制其显示和关闭。

不值一提的小问题，但当你的领导说：‘这个管理系统两天要上线!我给你们找到了个模版，往上一套就行了，很简单的。’ 你就知道头皮发麻是什么感觉了！（小声bb）。