feat(cascader): add Option item disableCheckbox (#42024)

* feat(cascader): add uncheckableItemValues props

* feat: add Option disableCheckbox

* chore: modify md

* chore: add test and lock version

* Update package.json

---------

Co-authored-by: 洋 <hetongyang@bytedance.com>
Co-authored-by: 二货爱吃白萝卜 <smith3816@gmail.com>
This commit is contained in:
2023-05-12 11:53:51 +08:00 committed by GitHub
parent 1d9cab6466
commit d32e8e67de
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 40 additions and 4 deletions

View File

@ -681,4 +681,38 @@ describe('Cascader', () => {
expect(selectedValue!.join(',')).toBe('zhejiang');
});
});
it('should be correct expression with disableCheckbox', () => {
const { container } = render(
<Cascader
multiple
options={[
{
label: '台湾',
value: 'tw',
children: [
{
label: '福建',
value: 'fj',
disableCheckbox: true,
},
{
label: '兰州',
value: 'lz',
},
{ label: '北京', value: 'bj' },
],
},
]}
/>,
);
fireEvent.mouseDown(container.querySelector('.ant-select-selector')!);
// disabled className
fireEvent.click(container.querySelector('.ant-cascader-menu-item')!);
expect(container.querySelectorAll('.ant-cascader-checkbox-disabled')).toHaveLength(1);
// Check all children except disableCheckbox When the parent checkbox is checked
expect(container.querySelectorAll('.ant-cascader-checkbox')).toHaveLength(4);
fireEvent.click(container.querySelector('.ant-cascader-checkbox')!);
expect(container.querySelectorAll('.ant-cascader-checkbox-checked')).toHaveLength(3);
});
});

View File

@ -1,7 +1,7 @@
## zh-CN
一次性选择多个选项。
一次性选择多个选项。通过添加 `disableCheckbox` 属性,选择具体某一个`checkbox`禁用 。可以通过类名修改禁用的样式。
## en-US
Select multiple options
Select multiple options. Disable the `checkbox` by adding the `disableCheckbox` property and selecting a specific item. The style of the disable can be modified by the className.

View File

@ -1,10 +1,11 @@
import React from 'react';
import { Cascader } from 'antd';
import React from 'react';
interface Option {
value: string | number;
label: string;
children?: Option[];
disableCheckbox?: boolean;
}
const options: Option[] = [
@ -26,6 +27,7 @@ const options: Option[] = [
{
label: 'Toy Fish',
value: 'fish',
disableCheckbox: true,
},
{
label: 'Toy Cards',

View File

@ -120,7 +120,7 @@
"copy-to-clipboard": "^3.2.0",
"dayjs": "^1.11.1",
"qrcode.react": "^3.1.0",
"rc-cascader": "~3.10.0",
"rc-cascader": "~3.11.2",
"rc-checkbox": "~3.0.0",
"rc-collapse": "~3.5.2",
"rc-dialog": "~9.1.0",