<template>
  <div>
    <el-breadcrumb separator="/">
      <template v-for="(item, index) in data">
        <el-breadcrumb-item v-if="item.path" :key="index" :to="{ path: item.path }">{{ item.name }}</el-breadcrumb-item>
        <el-breadcrumb-item v-else :key="index">{{ item.name }}</el-breadcrumb-item>
      </template>
    </el-breadcrumb>
  </div>
</template>
<script>
export default {
  props: {
    data: { type: Array },
  },
}
</script>
<style lang="scss" scoped>
::v-deep {
  .el-breadcrumb {
    .el-breadcrumb__item {
      span {
        color: #666;
        font-weight: normal;
      }
      &:last-child {
        span {
          color: #af1b40;
        }
      }
    }
  }
}
</style>
