vue控制表格点击就添加一行

最近在学习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({})
}
}

})

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