github_mirrors/gf-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/gf-vben-admin.git synced 2025-02-03 03:32:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: fix abnormal breadcrumb status

Browse Source
This commit is contained in:
vben 2020-10-23 00:04:26 +08:00
parent f75425d13b
commit 144fde8a68
1 changed files with 16 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/layouts/default/LayoutBreadcrumb.tsx
View File

@ -10,20 +10,23 @@ import { PageEnum } from '/@/enums/pageEnum';
import { isBoolean } from '/@/utils/is';
import { compile } from 'path-to-regexp';
import Icon from '/@/components/Icon';
export default defineComponent({
name: 'BasicBreadcrumb',
props: {
showIcon: {
type: Boolean,
default: false,
},
},
setup(props) {
setup() {
const itemList = ref<AppRouteRecordRaw[]>([]);
const { currentRoute, push } = useRouter();
watch(
() => currentRoute.value,
() => {
if (unref(currentRoute).name === 'Redirect') return;
getBreadcrumb();
},
{ immediate: true }
);
function getBreadcrumb() {
const { matched } = unref(currentRoute);
const matchedList = matched.filter((item) => item.meta && item.meta.title).slice(1);
@ -63,36 +66,23 @@ export default defineComponent({
return push(pathCompile(path));
}
watch(
() => currentRoute.value,
() => {
if (unref(currentRoute).name === 'Redirect') return;
getBreadcrumb();
},
{ immediate: true }
);
return () => (
<Breadcrumb class="layout-breadcrumb">
{() => (
<TransitionGroup name="breadcrumb">
{() => {
return unref(itemList).map((item) => {
const isLink = !!item.redirect && !item.meta.disabledRedirect;
const isLink =
(!!item.redirect && !item.meta.disabledRedirect) ||
!item.children ||
item.children.length === 0;
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}
</>
)}
{() => item.meta.title}
</BreadcrumbItem>
);
});