我有一个带有v模型的输入文本字段,每当有人点击"添加"按钮时,另一个输入文本会添加到DOM,并附加相同的v模型.我想我会得到一个v模型值的数组,但它只获得第一个v模型输入的值:
<div id="app">
<div id="references">
<input v-model="references" type="text">
</div>
<button @click="addReference">Add</button>
</div>
我附加到dom的html是由addReference方法触发的:
addReference: function(e) {
e.preventDefault();
console.log(this.references);
var inputEl = '<input v-model="references" type="text">';
$('#references').append(inputEl);
}
这是Vuejs不能做的事情吗？是否有不同的方法从动态dom元素中收集Vuejs的值？
new Vue({
el: "#app",
data: {
references: "text"
},
methods: {
addReference: function(e) {
e.preventDefault();
console.log(this.references);
var inputEl = '<input v-model="references" type="text">';
$('#references').append(inputEl);
}
}
})input {
display: block;
margin: 1px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="app">
<div id="references">
<input v-model="references" type="text">
</div>
<button @click="addReference">Add</button>
</div>