在VueJS中将一个输入框单向绑定到另一个

Bind an inputbox one-way to another in VueJS

本文关键字:输入 绑定 另一个 一个 VueJS      更新时间:2023-09-26

VueJS中是否有一种将输入框绑定到另一个输入框的方法,但只有一种方法?

我想在打字时把第1栏到第2栏复印一份。但当我开始编辑box2时,我不希望发生任何事情。(Box2还绑定到另一个VueJS字段)

我现有的jQuery on(点击)处理程序似乎被Vue否决了。。。

将第一个框绑定到v-model,然后将第二个框的"value"属性绑定到box1的model。你可以给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: ''
        }
    })

明白了:)只需为该功能添加一个方法。

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