Skip to content

Commit

Permalink
fix(Checkbox): support boolean value type, close #3931 (#4519)
Browse files Browse the repository at this point in the history 
* fix(Checkbox): fixed checkbox ts errors close #3931

* fix(Checkbox): add ts close #3931

* chore(Checkbox): adjust test case for #3931

---------

Co-authored-by: 珵之 <chengzhi.zpc@alibaba-inc.com>
  • Loading branch information
@YunMeng99 @YSMJ1994
YunMeng99 and YSMJ1994 committed Nov 15, 2023
1 parent dcd19d7 commit 26a08d8
Show file tree
Hide file tree
Showing 6 changed files with 45 additions and 13 deletions.
5 changes: 3 additions & 2 deletions docs/checkbox/index.en-us.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,16 @@ Checkbox is used to verify which options you want selected from a group. If you
| onChange | Callback function triggered when the state changes<br><br>**signatures**:<br>Function(checked: Boolean, e: Event) => void<br>**params**:<br>_checked_: {Boolean} The checked value of the underlying checkbox input <br>_e_: {Event} Dom event object | Function | func.noop |
| onMouseEnter | Callback function triggered when the mouse pointer enters the element.<br><br>**signatures**:<br>Function(e: Event) => void<br>**params**:<br>_e_: {Event} Dom event object | Function | func.noop |
| onMouseLeave | Callback function triggered when the mouse pointer leaves the element.<br><br>**signatures**:<br>Function(e: Event) => void<br>**params**:<br>_e_: {Event} Dom event object | Function | func.noop |
|value | The value of the Checkbox | String/Number/Boolean | - |

### Checkbox.Group

| params | desc | type | default |
| ---------------- | --------------------------------------------------- | -------- | ------------- |
| disabled | Set the status of all checkbox in group to be checked | Boolean | - |
| dataSource | Optional list, data item can be String or Object, for example `['apple', 'pear', 'orange']` or `[{value: 'apple', label: 'Apple',}, {value: 'pear', label: 'Pear'}, {value: 'orange', label: 'Orange'}]` | Array&lt;any> | \[] |
| value | The values of selected optional list | Array/String/Number | - |
| defaultValue | The values of default selected optional list | Array/String/Number | - |
| value | The values of selected optional list | Array/String/Number/Boolean | - |
| defaultValue | The values of default selected optional list | Array/String/Number/Boolean | - |
| children | To set nested checkbox by children components | Array&lt;ReactElement> | - |
| onChange | Callback function triggered when the selected value changes<br><br>**signatures**:<br>Function(value: Array, e: Event) => void<br>**params**:<br>_value_: {Array} values of selected optional list <br>_e_: {Event} Dom event object | Function | () => { } |
| direction | The direction of item's aligning<br>- hoz: horizontal (default)<br>- ver: vertical<br><br>**Allowed values**:<br>'hoz', 'ver' | Enum | 'hoz' |
Expand Down
6 changes: 3 additions & 3 deletions docs/checkbox/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
| onChange | 状态变化时触发的事件<br/><br/>**签名**:<br/>Function(checked: Boolean, e: Event) => void<br/>**参数**:<br/>_checked_: {Boolean} 是否选中<br/>_e_: {Event} Dom 事件对象 | Function | func.noop | |
| onMouseEnter | 鼠标进入enter事件<br/><br/>**签名**:<br/>Function(e: Event) => void<br/>**参数**:<br/>_e_: {Event} Dom 事件对象 | Function | func.noop | |
| onMouseLeave | 鼠标离开Leave事件<br/><br/>**签名**:<br/>Function(e: Event) => void<br/>**参数**:<br/>_e_: {Event} Dom 事件对象 | Function | func.noop | |
| value | checkbox 的value | String/Number | - | |
| value | checkbox 的value | String/Number/Boolean | - | |
| name | name | String | - | |
| isPreview | 是否为预览态 | Boolean | false | 1.19 |
| renderPreview | 预览态模式下渲染的内容<br/><br/>**签名**:<br/>Function(checked: Boolean, props: Object) => reactNode<br/>**参数**:<br/>_checked_: {Boolean} 是否选中<br/>_props_: {Object} 所有传入的参数<br/>**返回值**:<br/>{reactNode} Element 渲染内容<br/> | Function | - | 1.19 |
Expand All @@ -41,8 +41,8 @@
| ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------- | -------- | ---- |
| disabled | 整体禁用 | Boolean | - | |
| dataSource | 可选项列表, 数据项可为 String 或者 Object, 如 `['apple', 'pear', 'orange']` 或者 `[{value: 'apple', label: '苹果',}, {value: 'pear', label: '梨'}, {value: 'orange', label: '橙子'}]` | Array&lt;String>/Array&lt;Object> | \[] | |
| value | 被选中的值列表 | Array/String/Number | - | |
| defaultValue | 默认被选中的值列表 | Array/String/Number | - | |
| value | 被选中的值列表 | Array/String/Number/Boolean | - | |
| defaultValue | 默认被选中的值列表 | Array/String/Number/Boolean | - | |
| children | 通过子元素方式设置内部 checkbox | Array&lt;ReactElement> | - | |
| onChange | 选中值改变时的事件<br/><br/>**签名**:<br/>Function(value: Array, e: Event) => void<br/>**参数**:<br/>_value_: {Array} 选中项列表<br/>_e_: {Event} Dom 事件对象 | Function | () => {} | |
| direction | 子项目的排列方式<br/>- hoz: 水平排列 (default)<br/>- ver: 垂直排列<br/><br/>**可选值**:<br/>'hoz', 'ver' | Enum | 'hoz' | |
Expand Down
4 changes: 2 additions & 2 deletions src/checkbox/checkbox-group.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,11 +31,11 @@ class CheckboxGroup extends Component {
/**
* 被选中的值列表
*/
value: PropTypes.oneOfType([PropTypes.array, PropTypes.string, PropTypes.number]),
value: PropTypes.oneOfType([PropTypes.array, PropTypes.string, PropTypes.number, PropTypes.bool]),
/**
* 默认被选中的值列表
*/
defaultValue: PropTypes.oneOfType([PropTypes.array, PropTypes.string, PropTypes.number]),
defaultValue: PropTypes.oneOfType([PropTypes.array, PropTypes.string, PropTypes.number, PropTypes.bool]),
/**
* 通过子元素方式设置内部 checkbox
*/
Expand Down
2 changes: 1 addition & 1 deletion src/checkbox/checkbox.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@ class Checkbox extends UIState {
/**
* checkbox 的value
*/
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool]),
/**
* name
*/
Expand Down
31 changes: 31 additions & 0 deletions test/checkbox/group-spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -202,4 +202,35 @@ describe('Checkbox.Group', () => {
assert(wrapper.getDOMNode().innerText === 'checkbox preview');
});
});
it.only('value support bool`', () => {
let value = null;
const wrapper = mount(
<CheckboxGroup
onChange={v => {
value = v;
}}
dataSource={[
{
value: false,
label: '苹果',
},
{
value: true,
label: '橙子',
},
]}
/>
);

wrapper
.find('input')
.at(1)
.simulate('change');
assert.deepEqual(value, [true]);
wrapper
.find('input')
.at(0)
.simulate('change');
assert.deepEqual(value, [true, false]);
});
});
10 changes: 5 additions & 5 deletions types/checkbox/index.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
}

type data = {
value?: string | number;
value?: string | number | boolean;
label?: React.ReactNode;
disabled?: boolean;
[propName: string]: any;
Expand Down Expand Up @@ -48,12 +48,12 @@ export interface GroupProps extends HTMLAttributesWeak, CommonProps {
/**
* 被选中的值列表
*/
value?: Array<string> | Array<number> | string | number;
value?: Array<string> | Array<number> | Array<boolean> | string | number | boolean;

/**
* 默认被选中的值列表
*/
defaultValue?: Array<string> | Array<number> | string | number;
defaultValue?: Array<string> | Array<number> | Array<boolean> | string | number | boolean;

/**
* name
Expand All @@ -68,7 +68,7 @@ export interface GroupProps extends HTMLAttributesWeak, CommonProps {
/**
* 选中值改变时的事件
*/
onChange?: (value: Array<string>, e: any) => void;
onChange?: (value: Array<string> | Array<number> | Array<boolean>, e: any) => void;

/**
* 子项目的排列方式
Expand Down Expand Up @@ -110,7 +110,7 @@ export interface CheckboxProps extends HTMLAttributesWeak, CommonProps {
/**
* checkbox 的value
*/
value?: string | number;
value?: string | number | boolean;

/**
* name
Expand Down

0 comments on commit 26a08d8

Please sign in to comment.