最近在学习vue,在此做了一个记录。避免自己遗忘!!
vue和jquery的操作理念是不一样的。vue的所有操作都是数据的更新、新增和删除。
而要vue控制表格,实现点击一个按钮就添加一行。只要往里面新插入数据即可了。
其中需要用v-for标签来循环输出

 <tr v-for="(item,index) in add" :key="item.id">
        <td><input type="text" name="langName[]" ref="langName" value=""  /></td>
        <td> <input type="text" name="langChar[]" ref="langChar"  value=""/></td>
        <td>
            <div class="add" @click="addL(add.length)" title="添加一行" style="cursor:pointer;">+</div>
        </td>
        </tr>
        <tr>

然后在js里面设置数据,利用push标签往数据里面添加内容

var test=new VUE({
el:'#test',
data:{
add:[]
},
methods:{
addL(i){
this.add.push({})
}
}

})

这样就可以实现点击一下就实现添加一行了。

在这里插入图片描述
在这里插入图片描述

Logo

前往低代码交流专区

更多推荐