July 17, 2018

v-model vs sync in vue

Both v-model and sync can be used for two-way binding between components.

<comp v-model="bar"></comp>

expands to:

<comp :value="bar" @input="val => bar = val"></comp>
<comp :value.sync="bar"></comp>

expands to:

<comp :value="bar" @update:value="val => bar = val"></comp>

Basicly, sync was added after v-model. v-model can only be used on html input elements.

  • LinkedIn
  • Tumblr
  • Reddit
  • Google+
  • Pinterest
  • Pocket