Vue jsを使用して検証後にモーダルを閉じる方法は？

Question

フォームに<q-modal>（Quasar Framework）を使用しています。 Addボタンをクリックすると、フォームがポップアップします。ここでは、Submitボタンをクリックした後、各フォームタグを検証しています。モーダルを閉じるには、送信ボタンに@click="$refs.maximizedModal.close()"を使用しています。

すべて正常です。バリデーションがtrueを返さない場合、またはバリデーションが満たされてモーダルが閉じられる必要がある場合は、モーダルを保持する必要があります。

Vue jsで条件付きサブミットを行う方法はありますか？

Answer 1

あなたは、フォームの提出と、それを使用し、このような何かのためのカスタム関数にする必要があります。

を....

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 
    } 
    } 
} 

との代わりに、送信ボタン用の@clickを使用してこれをフォーム要素に追加してください：

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

これは役に立ちます。