Postpone method submission form?

Question

I have a form:

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

As doSomething()I was doing the check, and if it is true, I want to submit the form. How can I submit the form after verification?

Answer 1

Add the ref attribute to the form

You can add an attribute refto a form element. Then in the method doSomethingyou can submit the form via this.$refs.form.submit().

Template:

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

Vue Component Methods:

doSomething() {
  // do something

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

For more information on refs: https://vuejs.org/v2/api/#ref

Pass the event object to the method

You can also pass an event object by doSomethingadding a parameter $event. This gives the method a link to the target element:

Template:

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

Vue Component Methods:

doSomething(e) {
  // do something

  e.target.submit();
}