Challenge 1 / 1

In this video, we show a neat trick that we can do when submitting a form in Vue:

<form @submit.prevent="onSubmit">
    ...
</form>

What exactly does the modifier prevent do?

It prevents our component from breaking if there are any errors in our callback. It's essentially like wrapping the call with a try...catch.

It prevents other handlers from being executed on that same event, making our callback function exclusive.

It calls event.preventDefault() and event.stopPropagation() before calling our callback function, which means that the default behavior for that event (the form submitting) won't take place and the event won't bubble up.

It calls event.preventDefault() before calling our callback function, which means that the default behavior for that event (the form submitting) won't take place.

Rewatch the video