How to prevent Vue.js from triggering input event on elements after asyncData

Question

I have a problem. In my asyncData method I am receiving product data. A text input element containing name has an @input event listener, so when a name changes a request is sent to API to edit the product.

Unfortunately the @input event is being triggered after asyncData a returns name. So when I refresh the page, the request is always being sent. Is there any way to solve that problem?

In asyncData I get product name:

asyncData(context) {
    const slug = context.params.slug;

    return context.app.$axios.get(process.env.apiUrl + '/api/v1/features/' + slug)
        .then((response) => {
            const featureData = response.data.data;

            return {
                feature: {
                    name: featureData.name,
                }
            }
        })
        .catch((error) => {
            return context.redirect('/admin/features');
        })
}

And if I add a @input event listener on a element containing name:

<b-form-input @input="editFeature('name', feature.name, 'name')" 
              id="name" 
              type="text"
              v-model="feature.name"
              placeholder="Enter a name"
              required >
</b-form-input>

The editFeature method is always being triggered when I refresh the page. Because asyncData returns the name and therefore its value changes, the @input event is being triggered.