就是一个类似于下面的这样的布局:
准确的说,
面包屑
其实就在top和main之间,menu里的菜单控制右侧的main的页面(所以main页面是iframe加载的)。现在要做的是在添加页面,点击
面包屑
中的上一个链接跳到对应的父页面去,其实是很简单的,就是父页面的js方法可...
一、什么是
面包屑
A “breadcrumb” (or “breadcrumb trail”) is a type of secondary navigation scheme that reveals the user’s location in a website or Web application. The term comes from the Hansel and Gretel fa
它是一种线性的导航方式,是一种“历史记录”的应用方式,目的是帮助你追溯来路(在网页的应用中,“追溯来路”这件事浏览器已经很OK了)现在变成用来表达内容归属关系的界面元素。 我们经常看到的“主分类>一级分类>二级分类>三级分类>……>最终内容页面”这样的方式。
但是一般正常的来讲目录结构由3层结构组成。分别是首页>栏目页>内容页。
合理的构建目录结构可以让用户随时随地的找到自己所在的位置又能保证
render 是vue提供的一个渲染函数,优先级大于el,template等选项,用来提供组件结构。
vue2.0 render函数提供render(h){}函数用来创建节点
vue3.0 函数由 vue 直接提供,需要按需导入 import { h } from ‘vue’
this.$slots.default() 获取默认插槽的节点结构,按照要求拼接结构。
h函数的传参 tag 标签名|组件名称, props 标签属性|组件属性, node 子节点|多个节点
不要在 xtx-bread 组件插槽写
面包屑
是可长可短,所以我们选择用集合来存储
面包屑
信息。 当查询下级的时候,要添加
面包屑
。
当点
面包屑
,要展示所点击的
面包屑
下级数据,并且,面包只显示到当前层级。 要结
面包屑
集合的数据进行删除。
![
面包屑
的展示图](https://img-blog.csdnimg.cn/20190726195542968.png?x-oss-process=image/watermar...