element复选框单选
文章描述：
vue element复选框单选以及取消单选
<template>
<div class="container">
<el-checkbox-group v-model="checkList" ref="processedTableData">
<el-checkbox label="A" @change="clickcheck('A')"></el-checkbox>
<el-checkbox label="B" @change="clickcheck('B')"></el-checkbox>
<el-checkbox label="C" @change="clickcheck('C')"></el-checkbox>
<el-checkbox label="D" @change="clickcheck('D')"></el-checkbox>
</el-checkbox-group>
<div>
<div v-if="skillType=='A'">A</div>
<div v-if="skillType=='B'">B</div>
<div v-if="skillType=='C'">C</div>
<div v-if="skillType=='D'">D</div>
</div>
</div>
</template>
<script>
export default {
data(){
return{
checkList: [],
skillType:''
}
},
created() {
},
methods:{
// 复选框单选
clickcheck(val) {
if(this.skillType == val){
this.skillType = ''
}else{
this.skillType = val
}
if(this.checkList.length >= 2){
this.checkList = this.checkList.splice(1, 1)
}else{
}
},
}
}
</script>
发布时间：2023/09/20
发表评论