跳到主要内容

侧边栏

垂直展示的导航栏，用于在不同内容区域之间进行切换。

常见使用场景包括：

  • 商品分类页面中作为主导航组件使用
  • 多标签页内容展示
  • 二级导航展示

一、属性​

1. 数据源​

1）数据配置 - 手动赋值​

image-20250708170417031

手动赋值方式支持通过「添加项」或「导入数据」添加侧边栏子项：

  • 添加项：点击“添加项”按钮，即可手动录入子项数据。
  • 导入数据：需预先定义枚举或静态数据源，设置数据后选择对应项完成导入。

image-20250708170915333

2）数据配置 - 数据源​

通过绑定数据源进行侧边栏项的动态配置，详见 数据绑定。

2. 功能​

1）选中索引​

image-20250709083603603

用于设置默认选中的子项，可通过手动赋值或视图参数方式配置。

3. 状态​

无特殊状态配置，详见 通用状态。

二、属性 - 子项​

1. 数据 - 徽标类型​

image-20250709084227750

1）徽标类型​

支持设置以下三种徽标显示方式：

  • 无徽标
  • 小红点
  • 数字徽标

2）显示小红点​

用于提示新消息、待处理事项或更新提醒。可通过数据绑定控制其显示，详见 数据绑定。

image-20250709085558211

3）数字徽标设置​

支持设置：

  • 徽标内容
  • 最大显示值
  • 是否显示为零

注意：当徽标内容超过最大值时，将以「99+」的形式简略显示。

image-20250709084848467

2. 功能 - 标签​

支持设置子项的标签文本，如下图所示：

image-20250709085736071

3. 状态​

无特殊状态配置，详见 通用状态。

三、样式​

无特殊样式配置，详见 通用样式。

四、常见使用场景​

1. 分类内容展示​

通过侧边栏布局构建分类页面，不同标签可对应展示不同的内容区块。

image-20250709092021493

2. 多标签页式内容展示​

用于在一个页面中承载多个功能或信息区域的切换展示。

image-20250709091953154