HTML部分
<Tree
className={styles.menutree}
checkable
checkStrictly
checkedKeys={addMenuIds} // 勾选中的菜单
// defaultExpandAll
blockNode
onCheck={(…rest) =>
this.onAuthCheck(…rest, ‘2.1’, data)
}
>
{this.renderMenuPermissionTreeNodes(data)}
CSS部分
.menutree {
:global {
.ant-tree-treenode-switcher-close {
// display: flex;
.ant-tree-node-content-wrapper {
// flex: 1;
width: calc(100% - 24px);
}
}
.ant-tree-treenode-switcher-open {
.ant-tree-node-content-wrapper {
width: calc(100% - 24px);
}
}
.ant-tree-node-content-wrapper {
padding-right: 0 !important;
}
.ant-tree-node-content-wrapper:hover {
.risk {
visibility: visible;
}
}
}
}
JS部分
onAuthCheck = (checkedKeys, raw, type, functionalAuthorityList) => {
const { addMenuIds } = this.state;
const role = getAuthority(X-Role-OTA
) || [];
const { roleName } = getCurrentRole() || {};
let roleId = undefined;
role.map(item => {
if(item.roleName === roleName) {
roleId = item.roleId
}
})
const { checked, node, checkedNodes } = raw;
if (raw.checked)