iview中Modal對話框點擊肯定後會自動關閉窗口

問題描述:在某個頁面需打開一個Modal,而後這個Modal裏有一個Form表單,點擊肯定時我須要先校驗表單數據是否輸入正確,不肯定則不但願關閉窗口;(問題是:只要點擊確認 loading :false 狀況下iview默認就把窗口就關閉了)git

API上也只是說了經過loading狀態來手動關閉對話框,可是在須要驗證form表單,表單驗證經過再關閉modal 這種環境下,彷佛並不實用,當首次表單驗證不經過時,若設置 loading = true,此時的肯定按鈕一直爲加載狀態,後面那個肯定按鈕根本沒法點擊,github

後來在網上找到了解決辦法,親測能夠用,關鍵一步操做  this.$nextTick(() => { this.loading = true; }); 在這裏記錄下來:iview

<template>
    <div> <Button type="primary" @click="modal1 = true">顯示對話框</Button> <Modal v-model="modal1" title="Modal" @on-ok="ok" :loading="loading"> <p>對話框內容</p> <p>對話框內容</p> <p>對話框內容</p> </Modal> </div> </template> <script>  export default {  data () {  return {  modal1: false,  loading: true  }  },  methods: {  ok () {  this.$Message.info('異步驗證數據');  setTimeout(() => {  this.loading = false;  this.$nextTick(() => {  this.loading = true;  });  }, 1000);  }  }  } </script>測試以後仍是有一些小問題,不是功能上問題,表單驗證經過後,點擊確認按鈕,確認按鈕的加載狀態會閃現一下,而後看到modal關閉,後續再找找有沒有更好的辦法原文連接: https://github.com/iview/iview/issues/597
相關文章
相關標籤/搜索