Appearance
Breadcrumb 面包屑
显示当前页面的路径,快速返回之前的任意页面。
基础用法
适用广泛的基础用法。
在 fyo-breadcrumb 中使用 fyo-breadcrumb-item 标签表示从首页开始的每一级。
图标分隔符
通过图标作为分隔符。
设置 separator-icon 属性,属性值可以是图标组件。
玻璃拟态风格 (Unique)
独特的玻璃拟态风格,适合现代感强的页面。
设置 effect 属性为 glass 开启玻璃拟态效果。
Breadcrumb 属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| separator | 分隔符字符 | string | / |
| separator-icon | 图标分隔符组件 | string / Component | - |
| separator-class | 图标分隔符的类名 | string | - |
| effect | 风格主题,可选值: plain, glass | string | plain |
Breadcrumb Item 属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| to | 路由跳转对象,同 vue-router 的 to | string / object | - |
| replace | 在使用 to 进行路由跳转时,启用 replace 将不会向 history 添加新记录 | boolean | false |
Breadcrumb Slots
| 插槽名 | 说明 |
|---|---|
| default | 自定义默认内容 |
Breadcrumb Item Slots
| 插槽名 | 说明 |
|---|---|
| default | 自定义默认内容 |