从0开始学VUE--使用Django+Vue 构建一个Web项目(8) 面包屑 + Tag标签切换功能

面包屑效果

<el-breadcrumb separator-class="el-icon-arrow-right">
        <!--很明显 首页 一定是存在的 所以这里直接写死-->
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <!--第二级菜单名称 就要看左侧组件有没有点击指定菜单，没有那就只显示首页 点击就显示当前菜单名称-->
        <el-breadcrumb-item :to="current.path" v-if="current">{
  {
          current.label
        }}</el-breadcrumb-item>
      </el-breadcrumb>

Tag标签

新建一个vue文件

<template>
  <div class="tabs" margin="10px">
    <!--closable这里说明home是不能关闭的-->
    <el-tag
      :key="tag.name"
      size="small"
      v-for="(tag, index) in tags"