Vue input checkbox 全选反选

首先在终端中安装jquery

npm i jquery --save

            

                全选反选
            
            

                

                    
 {
    { index+1 }}  
                    

                        
{
    { shop.title }}
                        
¥{
    { shop.price }}
                    
                
            
        

import $ from "jquery";
    export default{
        data(){
            return{
                checked:false,
                colorList:['primary','danger','secondary','info'],
                shoplist:[
                    {title:'noodles',price:20,id:1},
                    {title:'rice',price:58,id:2},
                    {title:'sausage',price:35.5,id:3},
                    {title:'meat',price:100,id:4}
                ]
            }
        },
        methods:{
            calculate(index){
                var nm = this.colorList[Math.floor(Math.random() * this.colorList.length)];
                return "card mb-3 col-lg-3 border-"+nm;
            },
            ckb(event){
                //全选反选
                this.checked = $(event.target).prop("checked");
            }
        }
    }