组件设置多选,默认情况下:
当我们需要选中所有子级时,把所有的级别展示出来时,就需要设置一个属性:showCheckedStrategy
完整代码:
<ProFormCascader
label="采集目录"
name="catgIdArray"
placeholder="请选择"
rules={[{ required: true }]}
labelCol={{ span: 4 }}
request={async () => {
const res = await getPubCatgVersionTreeNodes();
if (res.status === 'success') {
if (res?.data?.length !== 0 && res?.data[0] !== null) {
return res.data;
}
}
}}
fieldProps={{
onChange: (value,selectedOptions) => {
setSelectedRowKeys(selectedOptions);
},
showArrow: false,
showSearch: true,
dropdownMatchSelectWidth: false,
multiple: true,// 是否支持多选
showCheckedStrategy: 'SHOW_CHILD', // 显示选中值的模式 SHOW_ALL:显示所有选中的节点(包括父节点),SHOW_CHILD:只显示选中的子节点,SHOW_PARENT:显示选中的节点及其父节点
fieldNames: {
label: 'name',
value: 'id',
},
displayRender: (selectedOptions) => {
return selectedOptions.join('/');
},
}}
/>