Oct 21, 2019 in Vue.JS

What are the supported modifiers on model?

1 Answer

Oct 21, 2019

There are three modifiers supported for v-model directive.

1. lazy: By default, v-model syncs the input with the data after each input event. You can add the lazy modifier to instead sync after change events.

<!-- synced after "change" instead of "input" -->
<input v-model.lazy="msg" >

2. number: If you want user input to be automatically typecast as a number, you can add the number modifier to your v-model. Even with type="number", the value of HTML input elements always returns a string. So, this typecast modifier is required.

<input v-model.number="age" type="number">

3. trim: If you want whitespace from user input to be trimmed automatically, you can add the trim modifier to your v-model.

<input v-model.trim="msg">
Click here to read more about Vue JS
Click here to read more about Insurance

Related questions

Oct 21, 2019 in Vue.JS
Oct 21, 2019 in Vue.JS
Oct 21, 2019 in Vue.JS