初始化

components/Breadcrumb.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class="sm:py-4 sm:px-0 mx-3 py-2">
+    <el-breadcrumb :separator-icon="ArrowRight">
+      <el-breadcrumb-item :to="{ path: '/' }">
+        <el-icon class="cursor-pointer">
+          <ElIconHouse/>
+        </el-icon>
+      </el-breadcrumb-item>
+      <el-breadcrumb-item v-if="data?.parentName">
+        <span class="cursor-pointer hover:font-bold" @click="openSpmUrl(`/product`,data,data.categoryId)">{{ data.parentName }}</span>
+      </el-breadcrumb-item>
+      <el-breadcrumb-item v-if="data?.categoryName">{{ title ? title : data.categoryName }}</el-breadcrumb-item>
+      <el-breadcrumb-item v-if="title">{{ title }}</el-breadcrumb-item>
+    </el-breadcrumb>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {ArrowRight} from '@element-plus/icons-vue'
+
+withDefaults(
+    defineProps<{
+      data?: any;
+      title?: string;
+    }>(),
+    {}
+);
+
+</script>