huangge1199/vue-pro
1
0
Fork 0
mirror of https://gitee.com/huangge1199_admin/vue-pro.git synced 2024-11-22 23:31:52 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix:yudao-ui-admin-vue3面包屑导航图标和文字不在同一水平线

Browse Source
This commit is contained in:
supine-win 2022-12-15 16:26:01 +08:00
parent afa3e6dc96
commit 634fbbe29f
2 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
yudao-ui-admin-vue3/src/components/Icon/src/Icon.vue
View File

@ -15,7 +15,9 @@ const props = defineProps({
// icon color
color: propTypes.string,
// icon size
size: propTypes.number.def(16)
size: propTypes.number.def(16),
// icon svg class
svgClass: propTypes.string.def('')
})
const elRef = ref<ElRef>(null)
@ -34,6 +36,11 @@ const getIconifyStyle = computed(() => {
}
})
const getSvgClass = computed(() => {
const { svgClass } = props
return `iconify ${svgClass}`
})
const updateIcon = async (icon: string) => {
if (unref(isLocal)) return
@ -66,13 +73,13 @@ watch(
</script>
<template>
<ElIcon :class="prefixCls" :size="size" :color="color">
<svg v-if="isLocal" aria-hidden="true">
<ElIcon :class="prefixCls" :color="color" :size="size">
<svg v-if="isLocal" aria-hidden="true" :class="getSvgClass">
<use :xlink:href="symbolId" />
</svg>
<span v-else ref="elRef" :class="$attrs.class" :style="getIconifyStyle">
<span class="iconify" :data-icon="symbolId"></span>
<span :class="getSvgClass" :data-icon="symbolId"></span>
</span>
</ElIcon>
</template>

2
yudao-ui-admin-vue3/src/layout/components/Breadcrumb/src/Breadcrumb.vue
View File

@ -53,7 +53,7 @@ export default defineComponent({
<ElBreadcrumbItem to={{ path: disabled ? '' : v.path }} key={v.name}>
{meta?.icon && breadcrumbIcon.value ? (
<>
<Icon icon={meta.icon} class="mr-[5px]"></Icon> {t(v?.meta?.title)}
<Icon icon={meta.icon} class="mr-[2px]" svgClass="inline-block"></Icon> {t(v?.meta?.title)}
</>
) : (
t(v?.meta?.title)