# 导航菜单

来源快照：`result_data_new_260518.json`

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

## 正文

# 导航菜单

一、

## 功能背景及价值用途

导航菜单组件可以通过链接地址实现一键跳转到其他菜单，比如页面、表单等。支持在当前页面展示，或者弹出新窗口等打开方式，用于实现页面导航。

导航菜单组件可用于特色主题搭建使用，也可直接在页面中作为快捷菜单导航使用。可满足多种使用场景。

二、

## 功能概述

1.

导航菜单组件支持在PC端和移动端中使用。PC端使用时，内容来源可选择：自定义（默认）、系统数据。移动端使用时，仅支持自定义导航项方式。

2.

PC端：内容来源选择自定义时，可自定义设置导航项。支持设置项：选中下级时上级联动选中、记住上次选中的标签项。

移动端：仅支持自定义设置导航项。支持设置项：选中下级时上级联动选中。

3.

内容来源选择系统数据时（仅PC端），可设置显示类型：一级应用、下级菜单、混合菜单（默认）。支持设置项：显示应用角标、展示EB应用和自定义应用。

4.

导航菜单组件支持选择不同的组件样式、以及支持自定义样式（仅PC端）

三、

## 功能详细说明

1.

### 功能入口

页面设计器-左侧组件列表，导航菜单组件显示在【基础组件/导航类】分组中，如下图所示：

找到导航菜单组件，将导航菜单组件拖入到页面中。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329911200071704&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.

### 基础配置

#### 2.1 内容来源设置-PC端

导航菜单组件内容来源可选择：自定义（默认）、系统数据

(1)

导航菜单组件内容来源选择：自定义时，可自定义配置导航项内容。

①

默认生成两条导航项数据

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329911200071715&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=1163329915581128712&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=1163329915713142810&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=1163329915581128724&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=1163329920001925127&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=1163329919994363962&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=1163329920001925140&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=1163329924095565832&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=1163329924101750803&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=1163329928566693889&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=1163329928581267489&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=1163329928578007083&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=1163329932878438401&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=1163329932688424979&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=1163329932703105052&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=1163329937031626769&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=1163329937148239897&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)

导航菜单组件内容来源选择：系统数据。通常用于特色主题的搭建。

内容来源选择系统数据时，支持设置显示类型，可选择：一级应用、下级菜单、混合菜单（默认）

①

显示类型选择一级应用时，导航菜单中数据获取门户菜单数据以及当前用户设置优先显示在主导航中的应用数据。

下方显示设置项：显示更多应用、显示应用角标。如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329941418868737&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=1163329941300600840&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=1163329941373894686&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=1163329945699155971&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=1163329945789333517&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=1163329945576587292&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=1163329950036066317&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=1163329950036066328&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=1163329950036066337&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=1163329954227445765&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=1163329954245050390&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)

③

显示类型选择混合菜单时，导航菜单组件获取系统应用数据。

下方显示设置项：显示应用角标、展示EB应用和自定义应用

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329954233630757&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=1163329958449840140&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=1163329958514024470&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)

【展示EB应用和自定义应用】开关：开关默认关闭，开关关闭时，导航菜单组件中仅显示系统类型应用数据，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329958449840170&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)

开关开启时，导航菜单组件中显示系统应用、EB应用、自定义应用，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329962937745419&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.2 内容来源设置-移动端

移动端导航菜单组件，仅支持自定义设置导航项内容。可设置固定区域、自定义添加导航项、设置导航项图标、名称、添加子菜单、显示/不显示状态、使用范围、使用范围中禁用、复制导航项、导航项事件动作、默认选中导航项、删除导航项数据以及选中下级时上级联动选中设置。此处增加“固定区域”设置项说明，其他设置项说明同上方“ 2.1 内容来源设置-PC端 ”中的内容

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329962957783057&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=1163329967009480706&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=1163329967182381067&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=1163329967020073000&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 组件样式-PC端

(1)

系统默认样式

设计器页面，选中导航菜单组件，可在样式-组件-选择组件样式中选择导航菜单组件样式，里面可选择系统默认样式及自定义新建的组件样式，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329971368296457&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=1163329971348594736&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)

系统默认样式共15个，包括横向菜单样式及纵向菜单样式。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329975831035907&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)

自定义样式

①

新建导航菜单组件自定义样式入口

前台-门户-设置-样式库-导航菜单-新建样式，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329975778607112&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=1163329975660339305&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)

后台-ebuilder低代码平台-开发-主题-组件样式-新建样式，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329980014026770&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=1163329980070543374&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=1163329980014026825&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)

③

自定义样式相关配置说明

1)

基础信息（新建组件样式时显示）

【名称】：设置当前导航菜单样式的名称

2)

导航菜单（新建组件样式时显示）

【横向菜单】、【纵向菜单】：单选框形式，设置菜单的显示样式为横向还是纵向，与样式信息中的【下级展示】设置项有联动效果。

当选择横向菜单时，下级展示下拉框值为：悬浮-横向平铺、悬浮-纵向平铺；当选择纵向菜单时，下级展示下拉框值为：悬浮-纵向平铺、树状展示，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329984434823185&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=1163329984253198350&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)

样式信息

【源码样式】：可输入代码实现自定义样式

【下级展示】：根据导航菜单中的值显示对应的选项值。导航菜单中选择横向菜单时，下级展示下拉框值为：悬浮-横向平铺、悬浮-纵向平铺；导航菜单中选择纵向菜单时，下级展示下拉框值为：悬浮-纵向平铺、树状展示。

【展示方式】：可选择图标+文字、仅图标、仅文字

【图标位置】：可选择顶部、左侧

【内边距】：设置导航菜单组件的内边距样式

【外边距】：设置导航菜单组件的外边距样式

【背景颜色】：设置导航菜单组件的背景颜色

【背景图片】：设置导航菜单组件的背景图片

【圆角】：设置导航菜单组件的圆角样式。全角、边角、以及圆角大小。

【边框】：设置导航菜单组件的边框样式。样式、线宽、颜色。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329984334987307&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)

4)

默认显示

可设置一级栏目及下级栏目样式，一级栏目对应一级菜单，下级栏目对应下级菜单。

一级栏目配置项如下：

【文字】：可设置文字字号、字体颜色、加粗样式、倾斜样式

【背景颜色】：设置菜单的背景颜色

【背景图片】：设置菜单的背景图片

【圆角】：设置菜单的圆角样式。全角、边角、以及圆角大小。

【边框】：设置菜单的边框样式。样式、线宽、颜色。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329988551426060&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=1163329988551426077&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)

5)

悬浮显示

可设置一级栏目及下级栏目样式，一级栏目对应一级菜单，下级栏目对应下级菜单。配置项说明见上方“4) 默认显示”

6)

选中显示

可设置一级栏目及下级栏目样式，一级栏目对应一级菜单，下级栏目对应下级菜单。配置项说明见上方“4) 默认显示”

 

## 四、注意点

各模块中新建的导航菜单组件自定义样式是相互独立的。例如在门户模块中新建的自定义样式，不会显示在e-builder模块的组件样式中，如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329992849424387&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=1163329992817967111&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)

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

1.

导航菜单组件，更多应用显示方式可跟随系统配置

更多应用展示方式支持移入展开、点击展开

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329992849424401&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=1163329997191692293&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.

导航菜单组件，内容来源为系统数据时，菜单图标可跟随系统配置

应用图标可在后台-应用管理-编辑应用-PC图标中设置

![](https://weapp.eteams.cn/papi/file/preview?fileId=1163329997261832204&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)
