CODEWITHSUNDEEP
vuejs2vuetify.js
Inigo EC
Inigo EC

Reputation: 2328

How to avoid v-text-field to emit input events?

I'm trying to simulate the v-model.lazy for my v-text-field due to performance constraints.

I tried this:

<v-text-field :value="p.name" @change="v => p.name = v" :data-vv-name="'name'+p.id" v-validate="'required|max:255'" :error-messages="errors.collect('form'+p.id+'.'+'name'+p.id)" :counter="255" :label="$t('property.name')" required maxlength="255" :data-vv-as="' '" v-else></v-text-field>

But I keep getting all the keydowns and input emits, which is provoking a big lag: enter image description here

If I use an input with a v-model.lazy it works as expected, but I'm not able to achieve the same thing using the v-text-field.

Should I use a prevent.default for those events?

Upvotes: 2

Views: 4157

Answers (1)

Inigo EC
Inigo EC

Reputation: 2328

Adding data-vv-delay="1000" and :value="p.name" @change="v => p.name = v" instead of v-model improved a lot the lag. This will delay de validation of the field.

The real solution would require v-model.lazy to work on Vuetify's v-text-field, but it is not the case yet.

Upvotes: 1

Related Questions