[Vuejs]-Return specific data from API when ENTER is pressed

by

0👍

Use a form submit handler

As we discussed in the comments: Yes, you cannot call barcodeSearch as a method, it is a computed value. But why not create a form handler for the component?

Let’s add a form submit handler. You only change this.barcodeSearch in that submit method and don’t bind it to the input. This way the only time barcodeSearch is updated is when the form is submitted (pressing enter, clicking search button, clicking "OK" on mobile, etc.).

So remove v-bind="barcodeSearch" from your form first.

Add a submit method for the form:

methods: {
  submitForm() {
    this.barcodeSearch = this.$refs.searchForm.barcode;
  }
}

Then add a submit handler to the form:

...
<form @submit.prevent="submitForm" ref="searchForm">
...

Now the computed value will only change when submitting the form.

Leave a comment