mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-17 19:00:15 +08:00
215d2ad883
* feat: add showCheckedStrategy api for cascader * feat: update doc * feat: add demo and update doc * feat: update demo
1.6 KiB
1.6 KiB
order | version | title | ||||
---|---|---|---|---|---|---|
5.1 | 4.20.0 |
|
zh-CN
通过设置 ShowCheckedStrategy
选择回填方式。
en-US
The way show selected item in box using ShowCheckedStrategy
.
import { Cascader } from 'antd';
const { SHOW_CHILD } = Cascader;
const options = [
{
label: 'Light',
value: 'light',
children: new Array(20)
.fill(null)
.map((_, index) => ({ label: `Number ${index}`, value: index })),
},
{
label: 'Bamboo',
value: 'bamboo',
children: [
{
label: 'Little',
value: 'little',
children: [
{
label: 'Toy Fish',
value: 'fish',
},
{
label: 'Toy Cards',
value: 'cards',
},
{
label: 'Toy Bird',
value: 'bird',
},
],
},
],
},
];
const App = () => {
const onChange = value => {
console.log(value);
};
return (
<>
<Cascader
style={{ width: '100%' }}
options={options}
onChange={onChange}
multiple
maxTagCount="responsive"
showCheckedStrategy={SHOW_CHILD}
defaultValue={[
['bamboo', 'little', 'fish'],
['bamboo', 'little', 'cards'],
['bamboo', 'little', 'bird'],
]}
/>
<br />
<br />
<Cascader
style={{ width: '100%' }}
options={options}
onChange={onChange}
multiple
maxTagCount="responsive"
defaultValue={['bamboo']}
/>
</>
);
};
ReactDOM.render(<App />, mountNode);