做网站界面一般用什么来做,上海做网站搜索一下马来西亚的,济南市住监局官网,成都专业网站建设React 开发问题积累1. 修改antd的组件样式2. antd级联选择框#xff08;后台数据渲染#xff09;1. 修改antd的组件样式
问题#xff1a;直接修改样式好像不起作用#xff0c;直接在组件上加style行内样式也不生效 方案#xff1a;用 :global样式穿透
全局样式直接使用 …
React 开发问题积累1. 修改antd的组件样式2. antd级联选择框后台数据渲染1. 修改antd的组件样式
问题直接修改样式好像不起作用直接在组件上加style行内样式也不生效 方案用 :global样式穿透
全局样式直接使用
:global{.antd-list{...}
}局部修改样式可以在组件外层的容器加上类名
.box{:global{.antd-list{...}}
}2. antd级联选择框后台数据渲染
问题将后台返回的数据构造成组件需要的样子 方案递归数据
fieldNames自定义字段名
Cascaderoptions{this.cmdbNodeList}onChange{this.onChange} fieldNames{{ label: name, value: name, children: children }}/二级级联选择 const classGradesData [];singleClassList singleClassList.forEach(item {const children [];//这里是生成children的数据结构item.classList.forEach(classListItem {children.push({value: classListItem.classId,label: classListItem.className,});});const newClassData {value: item.gradeName,label: item.gradeName,children,};return classGradesData.push(newClassData);
});二级以上级联选择
get dataList() {return this.cloneDeep(this.data.children); // this.data.children后台数据
}cloneDeep (tree) {return tree ? tree.map(item {return {value: item.id,label: item.name,children: this.cloneDeep(item.children)}}) : [];
}