<ul class="offer-wrap">
<li class="paymentOffer-list" v-for="(item,index) in paymentOffer"
:class="paymentChecked(item.id)?'checked':''"
@click="bindPaymentOffer(item)">
<p class="offer-name">{{item.name}}</p>
<p class="offer-faceValue">{{item.price}}</p>
</li>
</ul>
new Vue({
el:"#app",
data:{
paymentOffer: [
{
name: "優惠",
price: "12.00",
money: 100,
id: 0
},
{
name: "優惠",
price: "12.00",
money: 100,
id: 1
},
],
checkedOffer: [],
},
methods:{
bindPaymentOffer: function (item) {
for (var i = 0; i < this.checkedOffer.length; i++) {
if (this.checkedOffer[i].id == item.id) {
this.checkedOffer.splice(i, 1);
return true
}
}
if (this.checkedOffer.length < 2) {
this.checkedOffer.push(item);
}
return false;
},
paymentChecked: function (id) {
for (var i = 0; i < this.checkedOffer.length; i++) {
if (this.checkedOffer[i].id == id) {
return true
}
}
return false;
},
}
})
