vue多选

<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;
            },
    }
   
})