Breadcrumb 面包屑用于显示当前页面在系统层级结构中的位置，并能向上返回。
属性
Breadcrumb
| Antd | Element | 说明 |
|---|---|---|
| itemRender | — | 自定义链接函数，和 react-router 配置使用 |
| params | — | 路由的参数 |
| items | — | 路由栈信息 |
| separator | separator | 分隔符自定义 |
| — | separator-icon | 图标分隔符的组件或组件名 |
RouteItemType
RouteItemType 是 items 中的对象类型说明。
| Antd | 说明 |
|---|---|
| className | 自定义类名 |
| dropdownProps | 弹出下拉菜单的自定义配置 |
| href | 链接的目的地，不能和 path 共用 |
| path | 拼接路径，每一层都会拼接前一个 path 信息。不能和 href 共用 |
| menu | 菜单配置项 |
| onClick | 单击事件 |
| title | 名称 |
SeparatorType
SeparatorType 也是 items 中的其中一种类型。
| Antd | 说明 |
|---|---|
| type | 标记为分隔符 |
| separator | 要显示的分隔符 |
BreadcrumbItem
| Element | 说明 |
|---|---|
| to | 路由跳转目标，同 vue-router 的 to 属性 |
| replace | 如果设置该属性为 true, 导航将不会留下历史记录 |
小结
Ant Design 中 Breadcrumb 面包屑组件的封装比 Element Plus 更完善一些，其中的 Item 继承了路由的属性，上一篇 Anchor 组件中 Item 也是用 items 属性展示，这是否意味着从架构减少对子组件的依赖？
参考链接：
发表回复