element动态路由面包屑的实现示例

要掌握：localStorage，组件封装​

emm，第一次上传视频转gif的图片，效果不咋好。。。
视频转gif 的软件连接 https://www.jb51.net/softs/723131.html

在 components 下新建一个 curmbs 文件夹，并在该文件夹下新建一个 index.vue 文件。

router.js 中的配置，添加一个 meta对象

代码

上面 localStorage存储的name, path,breadNum 是我测试的时候存的，也可以删除，简洁版代码：

注册

如果想要一部分页面显示该组件，一部分不显示，那么需要用到 props 传参。
具体做法参考：
（1）在 index.js 中

export default {
props:{
       isShow:{
          type:Boolean,
          default:true //默认值为true 显示
       }
    }
}

(2) 组件调用时

 //false表示不显示面包屑

如果想要将左侧主导航栏也显示出来，则添加代码：
原代码：

  
   
     {{level.name}}
   
 

  {{$route.matched[0].name}}

到此这篇关于element动态路由面包屑的实现示例的文章就介绍到这了,更多相关element动态路由面包屑内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！