# 导航栏

来源快照：`result_data_new_260518.json`

- 来源 ID：`1183675454897725446`
- 模块：低代码平台e-builder
- 目录：页面引擎 - 页面设计器 - 页面组件 - 基础组件 - 基础组件/导航类
- space ID：`1157961794811633670`
- 原文链接：未提供
- 产品基线：未提供

## 正文

# 导航栏

## 一、功能背景及价值用途

在低代码平台中,导航栏组件主要是是用于在用户搭建的网页或者应用中提供导航功能的组件,用户可以通过导航栏快速访问网站或应用的不同页面或功能模块,帮助用户快速找到他们需要的信息或者服务,提升用户体验。

## 二、功能概述

导航栏可通过设置事件动作快速访问应用或者网页,帮助用户快速找到他们所需要的信息或者服务。同时导航栏组件还可以设置文本提示或数字提示,减少用户寻找信息的步骤。

## 三、使用说明

### 1、功能入口

设计器左侧“基础组件/导航类”分类下选中导航栏组件，在右侧配置面板操作相关配置。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330010046070790&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

### 2、基础配置

右侧箭头：此配置只针对末级导航项生效；开启，末级导航项显示右侧箭头；关闭，末级导航项隐藏右侧箭头（默认开启）；

分割线：开启后在两个导航项之间开启分割线（默认开启）

### 3、导航项

#### 3.1、导航项-编辑菜单

菜单名称:可通过该配置项修改该菜单的名称(必填)

动作:可以配置事件动作(打开页面,关闭窗口,条件控制等,详情见事件动作)

菜单显示:控制该导航项是否展示

使用范围和使用范围中禁用:可以控制导航项的展示权限

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330010173997070&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330010173997076&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

#### 3.2、导航项-添加子菜单

  可通过此按钮添加二级导航项,,配置项与编辑菜单相同

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330014281490476&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

#### 3.3、导航项-拆分背景

在导航项中点击拆分后基础设置中展示拆分背景配置项,可以设置导航项之间拆分后的背景色,同时原拆分按钮变为聚合,点击后可取消拆分效果

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330014385078290&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

#### 3.4、导航项-提示

在导航项中点击提示可以打开动态提示配置菜单

提示类型有数字和文本两种

数字:通过配置数据集,可以展示从数据源中计算得来的数字,例如列表总数等

文本:可以输入富文本显示所需要的提示信息

提示位置可以选择展示在导航项的右侧或者下侧

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330018792357900&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163330018763931671&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

## 四、上下游关联功能点

事件配置参考文档

[ _https://www.e-cology.com.cn/sp/doc/docDetail/1124192575847580693_](https://www.e-cology.com.cn/sp/doc/docDetail/1124192575847580693)
