antd|antd Cascader 联动选择框 选过之后保存 ，再选刚刚选择的数据重置为不可选 disabled
【antd|antd Cascader 联动选择框 选过之后保存 ，再选刚刚选择的数据重置为不可选 disabled】
文章图片
效果
1. 代码
加以下方法的判断 lastLevelResetNull可控制是否展示或不展示数据
init = () => {
// 楼层会议室配置-大厦接口
FloorguideAction.floorGuideMeetingBuildListTo({}).then((results) => {
if (!results.success) {
message.error("接口错误", 0.5);
return;
}
let { data = [] } = results;
this.setState({
data: this.lastLevelResetNull(data),
});
});
};
// 用来处理选择完的大厦和楼层 再次新增就不可选的功能lastLevelResetNull--> 最后一级重置为空
lastLevelResetNull = (data = https://www.it610.com/article/[]) => {
let result = [..._.cloneDeep(data)];
const loop = (re) =>
re.map((item) => {
// 判断每一项的disabled的属性is_save是否是true 如果是true就不能选择
item.disabled = item.is_save === "true";
if (!_.isEmpty(item.children)) {
loop(item.children);
} else {
item.children = void 0;
}
});
if (!_.isEmpty(result)) {
loop(result);
}
return result;
};
render() {
let { data = https://www.it610.com/article/[] } = this.state;
return (
推荐阅读
- 基于|基于 antd 风格的 element-table + pagination 的二次封装
- React|React antd 学习随笔
- 《协同》---如何打造高联动团队
- Android|Android 自定义有速率差的联动ScrollView
- 央地联动打造5G产业新版图|央地联动打造5G产业新版图 政府和企业布局万亿产业集群
- AntD+jsQr做一个简单的前端二维码识别
- 关于antdesign中formModel提供的resetFields方法不生效问题
- Flutter|Flutter 创建类似material 联动滚动 NestedScrollView
- vue3-antd-admin管理后台框架
- Ant|antd pro 4.0 动态菜单