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)}}) : [];
}