如何使用Vue js進行驗證後關閉模態？

我正在使用<q-modal>（Quasar Framework）表單。點擊Add按鈕，表格會彈出。在這裏，我點擊提交按鈕後驗證每個表單標籤。要關閉模式，我使用@click="$refs.maximizedModal.close()"作爲提交按鈕。如何使用Vue js進行驗證後關閉模態？

一切工作正常。現在我需要保留模態，如果驗證沒有返回true或驗證滿足，那麼模態需要關閉。

是否有任何方法可以在Vue js中進行條件提交？

來源

2017-08-28 Darshan theerth

你應該爲表單的提交和使用這樣的自定義函數，東西：

....

methods{ 
    checkForm(e){ 
    if(VALIDATION_IS_TRUE){ 
     //Validation has passed, we submit the form OR close the modal 
     $refs.maximizedModal.close(); // Maybe this.$refs.maximizedModal.close() 
     e.target.submit(); 
    }else{ 
     //The form is not validated, do something to inform the user 
    } 
    } 
}

而不是使用@單擊提交按鈕和，將其添加到表單元素：

<form @submit.prevent='checkForm($event)'>

希望這有助於！

來源

2017-08-28 13:36:52

$ refs.maximizedModal.close（）和這個$ refs.maximizedModal.close（）都會出錯。錯誤是 - this。$ refs.maximizedModal不是函數。 –

如果「this。$ refs.maximizedModal.close（）」不是一個函數，那麼也許你沒有正確訪問maximizedModal對象。在這種情況下，你應該在當前的組件中有一個組件，像。如果沒有找到這樣的標籤，就會出現像你這樣的錯誤。如果最大化模態不是該組件的子項，那麼將無法以這種方式訪問它。請記住，@ click =「$ refs.maximizedModal.close（）」與在vuejs組件中的方法內定義「this。$ refs.maximizedModal.close（）」相同。 –

如何使用Vue js進行驗證後關閉模態？

回答

相關問題