element-ui breadcrumb 组件源码分享

今日简单分享 breadcrumb 组件的源码实现,主要从以下三个方面:

1、breadcrumb 组件页面结构

2、breadcrumb 组件属性

3、breadcrumb 组件 slot

一、breadcrumb 组件页面结构

二、breadcrumb 组件属性

2.1 separator 属性,分隔符,类型 string,默认 /。

组件属性使用及展示效果:

小结:面包屑组件这样设计的优点:

  • 组件颗粒度更小,职责单一,使用更加灵活。
  • 传值简单,避免组件的高度耦合。

2.2 separator-class 属性,图标分隔符 class,类型 string,无默认值。

组件使用及展示效果:

三、breadcrumb 组件 slot

3.1 to 挂载,路由跳转对象,同 vue-router 的 to,类型 string/object,无默认值。

组件属性使用及展示效果:

3.2 replace 挂载,在使用 to 进行路由跳转时,启用 replace 将不会向 history 添加新记录,类型 boolean,默认 false。

组件属性使用及展示效果:

上一篇:intellij idea 使用git撤销(取消)commit


下一篇:法向量估计