将表单提交推迟到方法？

Question

我有一个表格:

<form id="myForm" @submit.prevent="doSomething()">...</form>

在doSomething()我做一个检查,如果是的话,我想提交表格.如何在支票后提交表格？

Answer 1

向表单添加ref属性

您可以ref向表单元素添加属性.然后,在该doSomething方法中,您可以通过提交表单this.$refs.form.submit().

模板:

<form id="myForm" ref="form" @submit.prevent="doSomething()">...</form>

Vue组件方法:

doSomething() {
  // do something

  this.$refs.form.submit();
}

有关refs的更多信息:https://vuejs.org/v2/api/#ref

将事件对象传递给方法

您还可以doSomething通过添加$event参数来传递事件对象.这为方法提供了对目标元素的引用:

模板:

<form id="myForm" @submit.prevent="doSomething($event)">...</form>

Vue组件方法:

doSomething(e) {
  // do something

  e.target.submit();
}