多选框Checkbox&多选框组CheckboxGroup

33 阅读1分钟

控制单个或者多个选项的选中状态,那么就可以使用多选框组件

1.Checkbox多选框组件

动画.gif

基本语法

Checkbox(options?: CheckboxOptions)

其中参数CheckboxOptions说明:

image.png

常用属性

image.png

2.CheckboxGroup

如果要控制多个Checkbox的选中状态,就可以通过CheckboxGroup来实现

基本语法

CheckboxGroup(options?: CheckboxGroupOptions)

2.1.基本使用

image.png

说明:CheckboxGroup 和 Checkbox 的组名一致,即可实现全选和反选。

2.2.onChange获取选中的结果值

除了视觉效果的实现全选和反选以外,还经常需要获取选中的值

核心步骤:

  1. 给 CheckBoxGroup 注册 onChange
  2. CheckBox 添加 name 属性
  3. 在 onChange的回调函数中获取 选中的 name 属性

事件onChange: image.png

CheckboxGroupResult对象说明

image.png