在VueJS中將輸入框單向綁定到另一個輸入框

Question

VueJS是否有將輸入框綁定到另一個輸入框的方法，但只有一種方法？

我想在打字時將box1複製到box2。但是當我開始編輯box2時，我不想發生任何事情。 （BOX2還與VueJS綁定到另一個字段）

看來，我的上（點擊）處理器現有的jQuery被否決的Vue ...

Answer 1

綁定所述第一框的V模型，然後結合該第二框 「value」 屬性的BOX1的模型。你可以給box2自己的模型，它也應該工作。

<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: '' 
 
     } 
 
    })

Answer 2

明白了:)只需添加一個方法此功能。

<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(); 
    } 
    } 
});