Vue，绑定输入以选择选项

Question

我在这个 vue 实例上的数据绑定仍然有一些问题。我只是想将每个选择选项与输入之一联系起来。因此，如果选择了选项值 110，那么我想显示输入的美元金额等。我已经将我的 vue 函数简化为只在控制台中显示值，它工作正常，因此绑定工作正常，但我仍然不确定如何将输入（用于显示/隐藏）与选择的值联系起来?这是笔：https : //codepen.io/anon/pen/ZdyXde<div id="discountChange" class="uk-grid">    <div class="uk-width-1-2">        <select name="discountChange" @change="changeDiscount" v-model="key">            <option value="110">Dollar Amount</option>            <option value="100">Percentage</option>            <option value="120">Terms</option>        </select>    </div>    <div class="uk-width-1-2">        $ <input class="md-input" type="text" name="dollarAmount">        % <input class="md-input" type="text" name="percentage">        <input class="md-input" type="text" name="terms">    </div></div>var changeDiscount = new Vue({    el: "#discountChange",    data: {    key: "",    },    methods: {        changeDiscount: function() {            console.log(this.key)        }    }})

Answer 1

我不确定您在做什么，但是您可以在输入中使用与您在“选择”中相同的 v-model="key" 来显示数据。或者只显示 :value="key" 以避免事件。