feat: restore the breadcrumb display icon function
This commit is contained in:
parent
a2c413a838
commit
f65bed72ac
|
|
@ -4,6 +4,7 @@
|
||||||
|
|
||||||
- 新增`pwa`功能,可在`.env.production`开启
|
- 新增`pwa`功能,可在`.env.production`开启
|
||||||
- Button 组件扩展 `preIcon`和`postIcon`属性用于在文本前后添加图标
|
- Button 组件扩展 `preIcon`和`postIcon`属性用于在文本前后添加图标
|
||||||
|
- 恢复面包屑显示图标功能
|
||||||
|
|
||||||
### 🎫 Chores
|
### 🎫 Chores
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
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';
|
||||||
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({
|
||||||
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>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue