[Vuejs]-Use static value while v-model is changing it

1๐Ÿ‘

โœ…

v-model is a two-way binding that will surely update wherever it is being used, so use another variable for your label instead.

For example, on the mounted hook, you can set the initial value of product.upc in another data variable and use that as your label.

On Js side-

data() {
  return {
    label: null,
    product: {
      upc: "something",
    }
  }
},
mounted() {
  this.label = product.upc
}

On the template side-

<div class="input-group-prepend">
  <label class="input-group-text p-0">@{{ label }}</label>
</div>
<input type="text" class="form-control text-center" v-model="product.upc">

Leave a comment