组件库开发（三）

「已注销」

已于 2022-05-21 21:25:21 修改

阅读量159

点赞数

分类专栏：笔记文章标签： elementui vue.js javascript

于 2022-05-21 21:20:50 首次发布

本文链接：https://blog.csdn.net/m0_59850509/article/details/124903551

版权

本文主要探讨了组件库中的CheckboxButton和CheckboxGroup组件。CheckboxButton组件提供了checked、theme、disabled等属性，而CheckboxGroup组件可通过内嵌checkbox或checkboxButton使用，并具有modelValue等属性，支持@change事件。

摘要由CSDN通过智能技术生成

通过内嵌checkbox或checkboxButton来使用

CheckboxGroup属性

介绍

本篇主要介绍CheckboxButton组件和CheckboxGroup组件

CheckboxButton组件

它的参数如下

checked: 初始值是否选中，
theme: checkbox的主题色，
disabled：是否禁用，
unsure：是否处于<不确定>状态，
modelValue：v-model绑定的值 Boolean，
size：组件的大小，
label：组件的标签
leftBorderRound: 是否左侧显示为圆角
rightBorderRound: 是否右侧显示为圆角

export const checkboxButtonProps = {
    checked: {
        type: Boolean,
        default: false,
        required: false
    },
    theme: {
        type: String,
        default: DefaultColor,
        required: false,
        validator(value:ComponentConstants.StandardColor){
            return ComponentConstants.StandardColorArr.includes(value)
        },
    },
    disabled: {
        type: Boolean,
        default: false,
        required: false
    },

    // 是否处于"不确定状态"    
    unsure: {
        type: Boolean,
        default: false,
        required: false
    },
    modelValue: {
        type: Boolean,
        default: false,
        required: false
    },
    size: {
        type: String,
        default: DefaultSize,
        required: false,
        validator(value:ComponentConstants.StandardSize){
            return ComponentConstants.StandardSizeArr.includes(value)
        }
    },
    label: {