[英]How to dynamically add a new object to array of vue (object) data- Vue.js?
我是 vue.js 的新手。 我正在处理表格。 我的表单中有一个添加按钮,当用户单击此按钮时,相同的表单字段将添加到此表单中。 用户可以添加任意多次。 为此,我的数据是 .
data () {
return {
form: [{
fieldOne: '',
fieldTwo: '',
}]
}
}
当用户单击 html 中的添加按钮时,我的 addForm 函数被调用。
addForm() {
let newObject = {
fieldOne: '',
fieldTwo: '',
}
this.form.push(newObject); // Gives error.
}
我读到了Vue.set 。 我可以轻松添加单个字段或对象。 但我不知道如何将对象添加到我的表单数组中。
请帮帮我。
那行得通。 你有什么问题?
标记
<div id="vueRoot">
<button @click="addForm">
Click Me !
</button>
{{form}}
</div>
代码
var vm = new Vue({
el : "#vueRoot",
data : {
form: [{
fieldOne: '',
fieldTwo: '',
}]
},
methods : {
addForm() {
let newObject = {
fieldOne: '',
fieldTwo: ''
}
this.form.push(newObject); // Gives error.
}
}
});
即使您是新手,只是环顾四周并尝试一下,如果您给事物起真名,您也会获得更多乐趣。 “form”和“fieldOne”将很快陷入困境!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.