UNPKG

zent

Version:

一套前端设计语言和基于React的实现

46 lines (34 loc) • 2.57 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
--- title: Checkbox subtitle: 多选 path: component/checkbox group: 基础控件 --- ## Checkbox 多选 用于从一个或多个可用选项中选择一个或一个以上的选项 ### 使用指南 - Checkbox 表现为一个[受控组件][https://facebook.github.io/react/docs/forms.html#controlled-components], 需要设置 `onChange` 回调在组件外部处理其 `value` 属性的变化。 - `value` 支持任意类型的值, 包括引用类型。 ### API #### Checkbox API | 参数 | 说明 | 类型 | 默认值 | | ------------- | ------------------------------------- | --------------------- | ------- | | checked | 指定当前是否选中 | `boolean` | `false` | | value | 组件对应的值，在`CheckboxGroup`中使用 | any | | | disabled | 使组件不可用 | `boolean` | | | readOnly | 使组件只读 | `boolean` | | | indeterminate | 展示部分选中的模式 | `boolean` | `false` | | onChange | 变化时回调函数 | `(e:Event) => void` | | | labelStyle | label 的内联样式 | `React.CSSProperties` | | | style | 内联样式 | `React.CSSProperties` | | | className | 自定义额外类名 | `string` | | #### Checkbox Group API | 参数 | 说明 | 类型 | 默认值 | | ------------ | --------------------------- | ----------------------------------- | --------------- | | value | 必填，指定选中的选项 | `any[]` | `[]` | | isValueEqual | 可选，判断 value 值是否相等 | `(a: any, b: any) => boolean` | `() => a === b` | | disabled | 使组件不可用 | `boolean` | | | readOnly | 使组件只读 | `boolean` | | | onChange | 变化时回调函数 | `(checkedValueList: any[]) => void` | | | className | 自定义额外类名 | `string` | | [controlled-components]: https://facebook.github.io/react/docs/forms.html#controlled-components