解決 iview-modal 點擊‘確定’按鈕時彈框自動關閉問題

遇到的問題：iview-modal在做數據校驗時，點擊確定，當校驗不通過時，彈框也自動關閉了

解決方案：

1.給Modal添加屬性loading後，點擊確定按鈕對話框不會自動消失，並顯示 loading 狀態，需要手動關閉對話框，常用於表單提交。

handleSubmit(name) {
      let self = this;
      this.$refs[name].validate((valid) => {
        setTimeout(() => {
          this.loading = false;
          this.$nextTick(() => {
             this.loading = true;
          });
        }, 100);
      })

}

2.利用<Modal></Modal>的slot,自定義寫底部按鈕，這樣就可以在按鈕點擊事件裏面去做數據的驗證，通過v-model控制模態框的顯示與隱藏。

<Modal title="xxx" v-model="showRejectModal">
   <!--重點來了-->
   <div slot="footer">
    <Button type="text" size="large" @click="cancel">取消</Button>
    <Button type="primary" size="large" @click="define">確定</Button>
   </div>

</Modal>

官網上Modal 可自定義的模塊如下：

不斷踩坑不斷挖掘