如何在菜单数组内子菜单中过滤角色

// 定义菜单数组
const menuItems = [
  {
    name: '首页',
    role: 'guest',
    children: []
  },
  {
    name: '产品',
    role: 'user',
    children: [
      {
        name: '手机',
        role: 'user',
        children: []
      },
      {
        name: '电视',
        role: 'admin',
        children: []
      }
    ]
  },
  {
    name: '订单',
    role: 'admin',
    children: []
  }
];

// 定义用户角色
const userRole = 'user';

// 过滤菜单数组
function filterMenuItems(menuItems, userRole) {
  const filteredMenuItems = [];

  for (const menuItem of menuItems) {
    if (menuItem.role === userRole) {
      // 如果菜单项的角色与用户角色匹配，则添加到过滤后的数组中
      filteredMenuItems.push(menuItem);
    } else if (menuItem.children && menuItem.children.length > 0) {
      // 如果菜单项有子菜单项，则递归过滤子菜单项
      const filteredChildren = filterMenuItems(menuItem.children, userRole);

      if (filteredChildren.length > 0) {
        // 如果子菜单项中有至少一个匹配的项，则添加该菜单项到过滤后的数组中
        filteredMenuItems.push({
          ...menuItem,
          children: filteredChildren
        });
      }
    }
  }

  return filteredMenuItems;
}

// 调用过滤函数并打印结果
const filteredMenu = filterMenuItems(menuItems, userRole);
console.log(filteredMenu);