Files
site-10584/components/Breadcrumb.vue
2026-01-29 10:43:43 +08:00

36 lines
1003 B
Vue

<!--面包屑-->
<script setup lang="ts">
import {ArrowRight} from '@element-plus/icons-vue'
withDefaults(
defineProps<{
data?: any;
// 父级栏目
categoryName?: string;
// 当前栏目
title?: string;
// 正文
detail?: string;
}>(),
{}
);
</script>
<template>
<el-breadcrumb :separator-icon="ArrowRight" class="py-4">
<el-breadcrumb-item :to="{ path: '/' }">
<el-icon class="cursor-pointer">
<ElIconHouse/>
</el-icon>
</el-breadcrumb-item>
<el-breadcrumb-item>
<nuxt-link :to="data.path ? navTo(data) : navTo(data,`/${data.model}/${data.categoryId}.html`)" class="cursor-pointer hover:font-bold">{{ categoryName || data.parentName }}</nuxt-link>
</el-breadcrumb-item>
<el-breadcrumb-item v-if="detail">
<span>{{ detail }}</span>
</el-breadcrumb-item>
<el-breadcrumb-item v-else>
<span>{{ title || data.title }}</span>
</el-breadcrumb-item>
</el-breadcrumb>
</template>