huangge1199/vue-pro
1
0
Fork 0
mirror of https://gitee.com/huangge1199_admin/vue-pro.git synced 2024-11-27 01:32:03 +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 // icon color
color: propTypes.string, color: propTypes.string,
// icon size // icon size
size: propTypes.number.def(16) size: propTypes.number.def(16),
// icon svg class
svgClass: propTypes.string.def('')
}) })
const elRef = ref<ElRef>(null) 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) => { const updateIcon = async (icon: string) => {
if (unref(isLocal)) return if (unref(isLocal)) return
@ -66,13 +73,13 @@ watch(
</script> </script>
<template> <template>
<ElIcon :class="prefixCls" :size="size" :color="color"> <ElIcon :class="prefixCls" :color="color" :size="size">
<svg v-if="isLocal" aria-hidden="true"> <svg v-if="isLocal" aria-hidden="true" :class="getSvgClass">
<use :xlink:href="symbolId" /> <use :xlink:href="symbolId" />
</svg> </svg>
<span v-else ref="elRef" :class="$attrs.class" :style="getIconifyStyle"> <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> </span>
</ElIcon> </ElIcon>
</template> </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}> <ElBreadcrumbItem to={{ path: disabled ? '' : v.path }} key={v.name}>
{meta?.icon && breadcrumbIcon.value ? ( {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) t(v?.meta?.title)