ux-ethos-checkboxgroup

--- Category:Components Subtitle:多选组 Type:通用 Title:Checkboxgroup ---

Usage no npm install needed!

<script type="module">
  import uxEthosCheckboxgroup from 'https://cdn.skypack.dev/ux-ethos-checkboxgroup';
</script>

README


Category:Components
Subtitle:多选组
Type:通用
Title:Checkboxgroup

描述

这是一个多选组按钮

何时使用

在我们的场景中如果需要使用到多选的场景,并需要成为一个组类来成为一个多选组,那么你会需要这个组件。

API


   let props ={ data:[
      {text:'处女座处女座处女座处女座处女座处女座处女座处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座处女座处女座处女座处女座处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座处女座处女座处女座处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座处女座处女座处女座处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座处女座处女座处女座处女座'},
      {text:'处女座'},
      {text:'处女座'},
      {text:'处女座'},
    ],
    isAllButton:true
    ,
    callback:this.callback
  }
    return <CheckboxGroup  {...props}/>

按钮的属性说明如下:

属性 说明 类型 默认值
text 这就是按钮对应的文字啊 string 默认参数
ischecked 这个参数是判断是不是被选中了如果是则值为 true,我们当然希望你会去传这个参数,但是没有也无所谓,我们在初始化的时候会帮你插一个 bool false
isgroup 这个参数是新添加的判断是否随props的改变而改变组件的状态,如果判断为是则值为 true ,同上 bool false
disabled 这个参数是选择按钮是否是可点击的。如果不可点击则为 true ,同上同上同上 bool false
handleClick 一个点击参数在点击按钮的时候执行 function ---
isAllButton 是否显示全选按钮 bool true

这里我们默认导出了一个叫做onAllChoses的函数

| allchose | 这个参数有0,1,2三种状态分别对应空,半选与全选| bool | false | | handleClick | 一个点击参数在点击按钮的时候执行 | function | --- |

禁用的情况全选如何处理