面包屑

更新时间:2025-01-24 07:41:21

简介

面包屑组件是一种导航工具,显示用户在网站或应用中的当前位置及其路径,帮助用户理解层级结构并方便地返回上级页面。

image

配置项

分类

配置

示例

说明

分类

配置

示例

说明

导航项

image

imageimage

面包屑组件的数据源,支持映射模式。每个导航项可支持配置标签目标页面提示文案图标隐藏禁用属性。

  • 标签:导航项的展示内容

  • 目标页面:点击导航项时跳转的页面,当前页面与目标页面一致时会高亮展示内容

  • 提示文案:鼠标悬浮时的提示

  • 图标:展示在标签旁

  • 隐藏:为true时隐藏当前导航项

  • 禁用:为true时禁止点击导航项

映射配置:

  1. 首先填写数据源。

  2. 使用currentItem(代表当前项的数据)和currentIndex(代表当前项的索引)将数据源和导航数据做对应

交互

隐藏

image

控制面包屑的默认展示状态,为true 时将隐藏面包屑

禁用

image

控制面包屑的禁用状态,true 时将禁止点击导航。

样式

外边距

image

面包屑组件的外边距,详情参见通用属性

CSS 样式

当前页面文字颜色

image

当前页面文字颜色

文字颜色

image

面包屑组件的文字颜色

分隔符颜色

image

数据间的分隔符颜色

悬浮时文字颜色

image

鼠标悬浮时文字颜色

属性与方法

名称

类型

示例

说明

名称

类型

示例

说明

items

array

breadcrumb1.items

只读,面包屑的数据源

disabled

boolean

breadcrumb1.disabled

面包屑的禁用状态

setDisabled

func

breadcrumb1.setDisabled(true)

设置当前面包屑组件的禁用状态,true 时将禁止点击面包屑

clearDisabled

func

breadcrumb1.clearDisabled()

清除当前面包屑组件的禁用状态

  • 本页导读
  • 简介
  • 配置项
  • 属性与方法