ElementUI之checkbox绑定数据和后端不一对的选中与不选中

先演示Html代码:

这里需要用到两个内容::true-label, :false-label

ElementUI之checkbox绑定数据和后端不一对的选中与不选中_第1张图片

上图是官方的参数说明。

如果你的服务端返回的是字符串就用 :true-label="1" ,如果是数字就是:true-label=1

v-model="item.init" 这里绑定对应的变量即可。

let app = new Vue({
        el:'#app',
        data(){
            return {
                cateList:[
                    {title:'新闻资讯',init:1,add:1,edit:1,del:1,listorder:1,remove:1},
                    {title:'行业新闻',init:0,add:0,edit:1,del:1,listorder:1,remove:1}
                ]
            };
        },
methods:{
            checkAll(checked,index){
               
            },
            changeItem(checked,index,type){
                console.log(checked,index,type);
                this.cateList[index][type] = checked==true?1:0;
                //处理全选状态
            }
        },

 这样一来我们就可以绑定的值和我们后台返回的值一致。

你可能感兴趣的:(JS,elementui,后端,vue.js)