elementUI多选框的其他样式
1.按钮样式
使⽤el-checkbox-group标签即可
2.带边框的多选框
在每个el-checkbox添加属性border即可
3.定义多选框的⼤⼩
在el-checkbox-group定义属性size,属性值可以选,medium,small,mini
<-color 被选中时按钮⽂字的颜⾊,⽤在el-checkbox-group标签⾥
5.fill 被选中时,按钮背景颜⾊,⽤在el-checkbox-group标签⾥
例⼦:
<template>
<div>
<el-checkbox-group v-model="test" @change="getValue()" size="mini" text-color="red" fill="green">
<el-checkbox-button v-for="(item,i) in items" :label="t" :key="i" :disabled="item.disabled" :checked="item.checked" ></el-checkbox-button> </el-checkbox-group>
</div>
</template>
<script>
export default {
name: "HelloWorld",
data () {
return {
test:[],
items:[
{id:0,content:"选项⼀",disabled:false,checked:true},
{id:1,content:"选项⼆",disabled:false,checked:true},
{id:2,content:"选项三",disabled:true,checked:false},
]
};
},
methods: {
div border属性getValue(){
console.st)
}
},
}
</script>
<style lang="css" scoped>
</style>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论