1.问题
默认的如果没有你的菜单结构是这样的:
[
{
children: [
{
name: "通用配置"
parentId: "1744857774620672"
path: "basic"
}
],
name: "系统管理"
parentId: "-1"
path: "system"
}
]
可以看到每层菜单的path都只有当前的路径,没有进行全拼接。
那么此时点击一级菜单就会有问题:
2.解决
让一级菜单进行全拼接,二三级等子菜单不做处理,仍然保持当前的path,也就是点击一级菜单自动打开它下面最深的第一个子菜单。
/**
* @description: 递归 设置一个父亲菜单完整的菜单路径,
* 例如:[{path:home,children;[{path:console}]}]
* 得到:[{path:home/console,children;[{path:console}]}]
* @param menuData 递归的对象
* @param parentPath 父路径
* @returns 替换后的对象
*/
export const setParentPaths = (data) => {
if (data.length === 0) return;
data.forEach((i) => {
const concatPaths = (item, parentPath = "") => {
const currentPath = parentPath + "/" + (item.path || item.fullPath);
if (item.children && item.children.length > 0) {
item.fullPath = concatPaths(item.children[0], currentPath);
} else {
item.fullPath = currentPath;
}
return item.fullPath;
};
concatPaths(i);
});
return data;
};