uniapp面包屑导航

uniApp的面包屑导航（Breadcrumbs Navigation），也称为导航路径，是一种常见的网站布局元素，它帮助用户理解当前页面在整个应用结构中的位置。在uniApp开发中，通过设置路由守卫（route guards）或者自定义组件，可以实现在每个页面顶部显示一条包含层级信息的路径。

在uniApp框架中，你可以创建一个自定义的Breadcrumb组件，并在每个需要展示路径的地方使用它。通常的做法是在`pages`目录下的index.vue文件中初始化并配置，或者在App.vue等全局文件中统一管理。当用户点击前一级的面包屑项时，应用会自动跳转到相应的路由。

下面是简单的实现步骤：

1. 创建`Breadcrumb.vue`组件：定义模板和数据状态来存储路径数组。
2. 使用`<router-view>`动态渲染当前页面路径。
3. 在`router-view`对应的生命周期钩子如`beforeRouteUpdate`中更新面包屑路径。

<template>
  <view class="breadcrumb">
    <view v-for="(item, index) in breadcrumbList" :key="index">
      {{ item.name }}
      <span @click="goToParent(index)" v-if="index !== breadcrumbList.length - 1">></span>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      breadcrumbList: [],
    };
  },
  methods: {
    goToParent(index) {
      // 跳转逻辑，比如使用Vue Router的`this.$router.push`方法
      this.$router.go(-1);
    },
  },
  watch: {
    $route(to, from) {
      this.breadcrumbList = this.get路线列表(); // 更新路径列表
    }
  },
};
</script>