VUE如何提交Table数据(解决相同属性多条数据不能双向绑定的问题)
类似这样的:解决方案:用数组形式提交使用v-for来遍历渲染,提交过去的就已经是每行的值组成数组1.前端代码<table class="table"><thead><tr><th>box</th><th>new&
·
类似这样的:
解决方案:用数组形式提交
使用v-for来遍历渲染,提交过去的就已经是每行的值组成数组
1.前端代码
<table class="table">
<thead>
<tr>
<th>box</th>
<th>new</th>
<th>rank</th>
<th>desc</th>
<th>title</th>
</tr>
</thead>
<tbody>
<tr v-for="(v,i) in tabData">
<td>{{v.box}}</td>
<td>{{v.new}}</td>
<td>{{v.rank}}</td>
<td><input type="text" v-model="tabData[i]['desc']"></td>
<td>{{v.title}}</td>
</tr>
</tbody>
</table>
<p>
<button @click="submitTab" type="primary">提交</button>
</p>
前端vue.js
//虚拟数据,也可以从后台传过来绑定给tabData
tabData: [
{
"box": 21650000,
"new": true,
"rank": 1,
"title": "Geostorm"
},
{
"box": 13300000,
"new": true,
"rank": 2,
"title": "Happy Death Day"
}
]
更多推荐
已为社区贡献3条内容
所有评论(0)