提交 f65bed72 作者: vben

feat: restore the breadcrumb display icon function

上级 a2c413a8
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
- 新增`pwa`功能,可在`.env.production`开启 - 新增`pwa`功能,可在`.env.production`开启
- Button 组件扩展 `preIcon``postIcon`属性用于在文本前后添加图标 - Button 组件扩展 `preIcon``postIcon`属性用于在文本前后添加图标
- 恢复面包屑显示图标功能
### 🎫 Chores ### 🎫 Chores
......
import type { AppRouteRecordRaw } from '/@/router/types'; import type { AppRouteRecordRaw } from '/@/router/types';
import type { RouteLocationMatched } from 'vue-router'; import type { RouteLocationMatched } from 'vue-router';
import type { PropType } from 'vue';
import { defineComponent, TransitionGroup, unref, watch, ref } from 'vue'; import { defineComponent, TransitionGroup, unref, watch, ref } from 'vue';
import Breadcrumb from '/@/components/Breadcrumb/Breadcrumb.vue'; import Breadcrumb from '/@/components/Breadcrumb/Breadcrumb.vue';
...@@ -10,10 +11,17 @@ import { PageEnum } from '/@/enums/pageEnum'; ...@@ -10,10 +11,17 @@ import { PageEnum } from '/@/enums/pageEnum';
import { isBoolean } from '/@/utils/is'; import { isBoolean } from '/@/utils/is';
import { compile } from 'path-to-regexp'; import { compile } from 'path-to-regexp';
import Icon from '/@/components/Icon';
export default defineComponent({ export default defineComponent({
name: 'BasicBreadcrumb', name: 'BasicBreadcrumb',
setup() { props: {
showIcon: {
type: Boolean as PropType<boolean>,
default: false,
},
},
setup(props) {
const itemList = ref<AppRouteRecordRaw[]>([]); const itemList = ref<AppRouteRecordRaw[]>([]);
const { currentRoute, push } = useRouter(); const { currentRoute, push } = useRouter();
...@@ -82,7 +90,20 @@ export default defineComponent({ ...@@ -82,7 +90,20 @@ export default defineComponent({
isLink={isLink} isLink={isLink}
onClick={handleItemClick.bind(null, item)} onClick={handleItemClick.bind(null, item)}
> >
{() => item.meta.title} {() => (
<>
{props.showIcon && item.meta.icon && item.meta.icon.trim() !== '' && (
<Icon
icon={item.meta.icon}
class="icon mr-1 "
style={{
marginBottom: '2px',
}}
/>
)}
{item.meta.title}
</>
)}
</BreadcrumbItem> </BreadcrumbItem>
); );
}); });
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论