0.0.4

Breadcrumb 面包屑 ​

显示当前页面路径，便于返回上级。

基础用法 ​

在 el-breadcrumb 中，每个 el-breadcrumb-item 代表一级，从首页开始。组件提供字符串属性 separator 作为分隔符，默认值为 '/'。

图标分隔符 ​

设置 separator-icon 使用 SVG 图标作为分隔符，会覆盖 separator。

下拉菜单 ​

通过设置 dropdown 属性，可以为面包屑项添加下拉菜单功能。支持自定义触发方式、位置和样式。

面包屑 API ​

面包屑 属性 ​

名称说明类型默认值
separator分隔符string/
separator-icon图标分隔符组件string / Component—

面包屑 插槽 ​

名称说明子标签
default自定义默认内容面包屑项

面包屑项 API ​

面包屑项 属性 ​

名称说明类型默认值
to链接目标路由，与 vue-router 的 to 相同string / object''
replace为 true 时导航不会留下历史记录booleanfalse
dropdown下拉菜单选项列表，如果设置则显示为下拉菜单array—
dropdown-trigger下拉菜单触发方式stringhover
dropdown-placement下拉菜单位置stringbottom
dropdown-icon下拉图标组件string / ComponentArrowDown
ts
interface BreadcrumbDropdownItem {
  /** 下拉项文本 */
  label: string
  /** 命令值，会在 command 事件中返回 */
  command?: string | number | object
  /** 是否禁用 */
  disabled?: boolean
  /** 是否显示分割线 */
  divided?: boolean
}

面包屑项 事件 ​

名称说明类型
command下拉菜单项被点击时触发item: `BreadcrumbDropdownItem` => void

面包屑项 插槽 ​

名称说明
default自定义默认内容