<div id="itany">
<table border='1' bordercolor='black' cellspacing='0'>
<tr>
<th>数量</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>总价</th>
</tr>
<tr v-for='(value,index) in arr'>
<td>{{index+1}}</td>
<td>{{value.name}}</td>
<td>${{value.money}}</td>
<td>
<button v-on:click="clear(index)">-</button>
{{value.how}}
<button v-on:click="add(index)">+</button>
</td>
<td>{{value.price}}</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td>总价{{all}}</td>
</tr>
</table>
</div>
<script src="vue.js"></script>
<script>
new Vue({
el:'#itany',
data:{
arr:[
{name:"kar98k",money:3999,how:0,price:0},
{name:"M4A1",money:2890,how:0,price:0},
{name:"AWM",money:3259,how:0,price:0},
],
all:0
},
methods:{
clear:function(i){
if(this.arr[i].how>=1){
this.arr[i].how-=1,
this.arr[i].price=this.arr[i].how*this.arr[i].money,
this.all-=this.arr[i].money
}
},
add:function(i){
this.arr[i].how+=1,
this.arr[i].price=this.arr[i].how*this.arr[i].money,
this.all+=this.arr[i].money
}
}
})
</script>
网友评论