vue项目中checkbox的坑

今天遇到的问题是,勾选传参在谷歌和ie下是反过来的,把checkbox的click事件改成change就好了
vue项目中checkbox的坑_第1张图片

<span>
     <label><input type="checkbox" name="vehicle" value="Car" v-model='checkboxStatus' class="check_shidu" @change="checkRead()"><i>有试读i>label>
span>
//勾选试读
        checkRead(){
            console.log(this.checkboxStatus);
            this.pageNum = 1;
            if(this.checkboxStatus){
                this.sfydzs = '100002.101'
                if(this.clcFlag){
                    //查中图法分类书
                    this.queryClcList('/rmd/v2/portal/pb/portal/classifyCodeBook/action/search/page');
                }else{
                    //查学科分类书
                    this.queryClcList('/rmd/v2/portal/pb/portal/subjectCodeBook/action/search/page');
                }
            }else{
                this.sfydzs = ''
                if(this.clcFlag){
                    //查中图法分类书
                    this.queryClcList('/rmd/v2/portal/pb/portal/classifyCodeBook/action/search/page');
                }else{
                    //查学科分类书
                    this.queryClcList('/rmd/v2/portal/pb/portal/subjectCodeBook/action/search/page');
                }
            }
        },

如果在checkbox上使用的是@click事件,this.checkboxStatus在谷歌浏览器在选中状态打印是false,ie浏览器是true,
change事件就没有这个兼容问题

你可能感兴趣的:(前端)