[Vuejs]-Bind an inputbox one-way to another in VueJS

by

2👍

✅

Bind the first box to a v-model, then bind the second boxes “value” attribute the box1’s model. You can give box2 its own model and it should work as well.

<div id="app">
    <input type="text" v-model="box1">
    <input type="text" v-model="box2" :value="box1">
</div>

vm = new Vue({
        el: '#app',
        data: {
            box1: '',
            box2: ''
        }
    })
👤Caleb Porzio

0👍

Got it 🙂 Just add a method for this feature.

<input v-model="productName" v-on:keyup="updateSKU" type="text">

new Vue({
  el: '#app',
  data : {
    productName : '',
    productSku : ''
  },
  methods : {
    updateSKU : function() {
      this.productSku = this.productName.toUpperCase();
    }
  }
});
👤Milkmannetje

Leave a comment