# 4.4.3打开方式

跳转新的目标页面时，有四种不同的打开目标页面的方式，分别是弹框、新页面、下钻、当前页、父窗口

-   弹框：跳转时，目标页面会以弹框的方式弹出来，如图4-4-3-1所示，而弹框的弹出方式（是否蒙层）、弹框的宽和高、弹框弹出时位于页面的位置（居上、居左）、弹框的背景色，都可以进行设置，如图4-4-3-2所示

![](/uploads/projects/dashboard/202605/18b13622d2b7f4bc.png)

图4-4-3-1弹框显示效果

![](/uploads/projects/dashboard/202605/18b13622d38463e8.png)

图4-4-3-2弹框设置样式

【使用场景】

仪表板中饼图 A 资源 --》跳转至点地图 B 资源 --》跳转至填充地图 C 资源。 在 B 资源跳转至 C 资源中，是否全屏选择是，页面展示效果如图4.4.3.3所示。

![](/uploads/projects/dashboard/202605/18b13622d48e925c.png)

图4-4-3-3全屏展示效果

-   新页面：跳转到目标页面时，会新打开一个页面，视觉效果比较明显效果。预览页面效果如图4-4-3-4所示。

![](/uploads/projects/dashboard/202605/18b13622d5ef01a8.png)

图4-4-3-4 新页面

-   下钻：跳转到目标页面时，会在当前页面的基础上，将目标页面显示出来，且会增加一个【返回】按钮，点击返回按钮，可以返回到源页面，但是这样会使源页面和目标页面的内容重叠在一个页面，如图4-4-3-5是跳转的源页面，图4-4-3-6是跳转的目标页面，图4-4-3-7是跳转方式选择下钻的效果页面

![](/uploads/projects/dashboard/202605/18b13622d9c73f03.png)

图4-4-3-5是跳转的源页面

![](/uploads/projects/dashboard/202605/18b13622dedd4ca4.png)

图4-4-3-6是跳转的目标页面

![](/uploads/projects/dashboard/202605/18b13622e0746955.png)

图4-4-3-7是跳转方式选择下钻的效果页面

-   当前页：跳转时，目标页面和源页面在同一个页面上显示，执行跳转动作时，将源页面刷新为目标页面，且页面没有返回按钮。预览如图4-4-3-8所示

![](/uploads/projects/dashboard/202605/18b13622e1e4e7f0.png)

图4-4-3-8 当前页效果图

-   父前页：跳转时，目标页面和源页面的父页面上显示，执行跳转动作时，将源页面的父页面刷新为目标页面，且页面没有返回按钮。

选择资源方式为：父页面。实现 A --跳转（父页面）-->B --跳转（父页面）-->C

1）在应用中心页面（第一个页面）点击资源 父--》父 （第二页面 也是 A 页面）如图4-4-3-9所示

![](/uploads/projects/dashboard/202605/18b13622e3140155.png)

图4-4-3-9源页面显示

1.  点击东北进行跳转。第二页面为：B 页面，如图4-4-3-10所示

该资源未找到父页面，则页面刷新当前页面

![](/uploads/projects/dashboard/202605/18b13622e40f9dc7.png)

图 4-4-3-10第一次跳转如页面

1.  再次点击东北进行跳转。第一页面更改为：C 页面，跳转至父页面，如图4-4-3-11所示。

![](/uploads/projects/dashboard/202605/18b13622e504cb50.png)

图 4-4-3-11第二次跳转如页面

-   动态菜单

跳转设置中配置动态菜单可以在点击配置了跳转的列时动态打开一个新的菜单。 跳转设置界面打开方式新增一个选项动态菜单，选择动态菜单后底部配置参数的位置更 新为菜单、菜单幻灯区和菜单名称设置。跳转打开动态菜单需要配合菜单以及菜单幻灯区使 用，可以追加一个动态菜单，并在菜单幻灯区中显示跳转中配置的资源。举例说明，已有如下资源，左侧是一个自助分析清单表，右侧上方是一个菜单，下方是菜单幻灯区。现通过动态菜单实现点击左侧清单表的区域，右侧新增一个菜单，菜单名称为 条形图，打开对应的条形图资源。如图4.4.3.12所示。

![](/uploads/projects/dashboard/202605/18b13622e6a62688.png)

图 4-4-3-12仪表板资源解析

点击左侧清单表的下拉菜单打开跳转配置，跳转列选择区域，打开方式选动态菜单，目标是想要展示的条形图，菜单和幻灯区分别选择已经添加到面的菜单和幻灯区即可，菜单名称可自定义，此处命名为条形图。如图4.4.3.13所示。

![](/uploads/projects/dashboard/202605/18b13622e85262de.png)

图 4-4-3-13动态菜单设置

接下来查看效果，点击左侧区域，右侧动态增加一个菜单，名称为“条形图”，下方展示对应的条形图资源。如图4.4.3.14所示。

![](/uploads/projects/dashboard/202605/18b13622e9c22f03.png)

图 4-4-3-14动态菜单展示

鼠标放在新生成的动态菜单上会出现一个删除按钮，动态菜单是支持实时删除，删除后 再点击跳转列可重新生成。如图4.4.3.15所示。

![](/uploads/projects/dashboard/202605/18b13622ea970980.png)

图 4-4-3-14删除动态菜单