vue,table,v-for循环tr,tr内部v-for循环select下拉框取值问题

简介: vue,v-model ,v-for,循环select的取值问题;v-for循环tr,里面再次v-for一个select,取值问题

第一篇博客就是个vue的问题,汗,,,

使用vue只能是数据:

6b74ec9172deefb33b353b8a7d3093205d873e42

其中的,DVD——租借押金,DVD_时长;总金额,都是data:{里面的数据};

HTML代码如下:

<tbody>
<tr v-for="dvd in dvds">
<td><input type="checkbox" ></td>
<td v-text="dvd.id">/td>
<td v-text="dvd.name"></td>
<td v-text="dvd.price"></td>
<td v-text="ses"></td>
<td>
<select v-model="ses" > 由于使用了v-model,这里的select的值代表着最后一个,会互相影响;多个select列表一个变化,别的都会引起一模一样的变化;
<option disabled value="">请选择</option>
<option v-for="s in selected" :value="s.money" v-text="s.leasedate"></option>
<!--<option>7</option>-->
<!--<option>15</option>-->
<!--<option>30</option>-->
<!--<option>永久</option>-->
</select>
</td>
<td v-text="zje = ses + dvd.price"></td>
<td class="text-center">
<button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal" >租借</button> //里我点击租借的时候,使用的是 zje的数据,导致zje的数值是循环的最后一个的数值
</td>
</tr>

</tbody>

VUE代码如下:

<script>
var vm = new Vue({
el:"#app",
data:{
ses:0,
selected:{},
dvds:[],
// dvd:{},
zje:0 // 总金额
},
methods:{

},
// 实例创建完成之后,初始化内容
created(){
// 查询DVD租借的信息
axios.get("/lease/findAll").then(res => {
this.selected = res.data.rows
}),
// 查询DVD信息
axios.get("/dvd",{
params:{
page:1,
rows:100
}
}).then(res => {
this.dvds = res.data.rows
})
}
})
</script>

那么有没有一种比较好的解决方案,自己没有一点思路;请路过的大神进来看一眼

目录
相关文章
|
16天前
Vue3框架中让table合计居中对齐
Vue3框架中让table合计居中对齐
|
20天前
|
JavaScript
vue给table组件添加合计
vue给table组件添加合计
12 0
|
2月前
|
JavaScript
Vue中的v-for中:key是必须的吗?为什么?
Vue中的v-for中:key是必须的吗?为什么?
51 0
|
2月前
|
JavaScript
vue 实现表格循环滚动 vue-seamless-scroll插件的安装与使用
vue 实现表格循环滚动 vue-seamless-scroll插件的安装与使用
|
3月前
|
JavaScript 前端开发
【面试题】 vue为什么v-for的优先级比v-if的高?
【面试题】 vue为什么v-for的优先级比v-if的高?
N..
|
29天前
|
JavaScript 前端开发 开发者
Vue.js的v-for指令
Vue.js的v-for指令
N..
11 1
|
1月前
|
JSON JavaScript 算法
Vue之v-for(包含key内部原理讲解)
Vue之v-for(包含key内部原理讲解)
|
2月前
|
API
table组件隐藏额外内容并使用Toolpit显示(vue3)
table组件隐藏额外内容并使用Toolpit显示(vue3)
|
2月前
Xpath获取Table+遍历tr
Xpath获取Table+遍历tr
39 3
|
2月前
|
JavaScript 前端开发 算法