fix: fix the problem of collapsed display when the menu has no child nodes

vben

2020-10-22 5cff73bcafc27a36f111949d33f463dd2bb52571

fix: fix the problem of collapsed display when the menu has no child nodes

 src/components/Menu/src/index.less

@@ -248,15 +248,15 @@
    }

    &.ant-menu-inline-collapsed {
      .ant-menu-submenu-selected,
      .ant-menu-item-selected {
        .active-style();
      }

      .ant-menu-item-selected {
        background: unset !important;
        box-shadow: none;
      }

      .ant-menu-submenu-selected,
      .ant-menu-item-selected {
        .active-style();
      }
    }
  }


 src/layouts/default/LayoutBreadcrumb.tsx

@@ -46,11 +46,13 @@
      if (homeRoute.name === firstItem.name) return false;
      return homeRoute;
    }

    function pathCompile(path: string) {
      const { params } = unref(currentRoute);
      const toPath = compile(path);
      return toPath(params);
    }

    function handleItemClick(item: AppRouteRecordRaw) {
      const { redirect, path, meta } = item;
      if (meta.disabledRedirect) return;
@@ -71,37 +73,33 @@
    );

    return () => (
      <>
        <Breadcrumb class="layout-breadcrumb">
          {() => (
            <>
              <TransitionGroup name="breadcrumb">
                {() => {
                  return unref(itemList).map((item) => {
                    const isLink = !!item.redirect && !item.meta.disabledRedirect;
                    return (
                      <BreadcrumbItem
                        key={item.path}
                        isLink={isLink}
                        onClick={handleItemClick.bind(null, item)}
                      >
                        {() => (
                          <>
                            {props.showIcon && item.meta.icon && item.meta.icon.trim() !== '' && (
                              <Icon icon={item.meta.icon} class="icon mr-1 mb-1" />
                            )}
                            {item.meta.title}
                          </>
      <Breadcrumb class="layout-breadcrumb">
        {() => (
          <TransitionGroup name="breadcrumb">
            {() => {
              return unref(itemList).map((item) => {
                const isLink = !!item.redirect && !item.meta.disabledRedirect;
                return (
                  <BreadcrumbItem
                    key={item.path}
                    isLink={isLink}
                    onClick={handleItemClick.bind(null, item)}
                  >
                    {() => (
                      <>
                        {props.showIcon && item.meta.icon && item.meta.icon.trim() !== '' && (
                          <Icon icon={item.meta.icon} class="icon mr-1 mb-1" />
                        )}
                      </BreadcrumbItem>
                    );
                  });
                }}
              </TransitionGroup>
            </>
          )}
        </Breadcrumb>
      </>
                        {item.meta.title}
                      </>
                    )}
                  </BreadcrumbItem>
                );
              });
            }}
          </TransitionGroup>
        )}
      </Breadcrumb>
    );
  },
});