el-checkbox 实现单选功能

一、两个多选框实现单选data(){return{ status:1 }}<el-checkbox-group v-model="status"><el-checkboxfalse-label='null' :true-label="1" name="status">启用</el-checkbox><el-checkboxfalse-label='null

℡何必。

12024人浏览 · 2021-12-21 10:37:54

℡何必。 · 2021-12-21 10:37:54 发布

一、两个多选框实现单选

data(){
  return{ status:1 }
}


<el-checkbox-group v-model="status">
    <el-checkbox  false-label='null' :true-label="1" name="status">启用</el-checkbox>
    <el-checkbox  false-label='null' :true-label="2" name="status">禁用</el-checkbox>
</el-checkbox-group>

二、多个单选框实现单选

data(){
   return { checkList:[] }
}


<el-checkbox-group v-model="checkList" @change="statusChange">
    <el-checkbox label="1">1</el-checkbox>
    <el-checkbox label="2">2</el-checkbox>
    <el-checkbox label="3">3</el-checkbox>
    <el-checkbox label="4">4</el-checkbox>
</el-checkbox-group>


methods:{
	statusChange(value){
        if(this.checkList.length > 1){
            this.checkList.splice(0,1)
        }
    }
}