文档

如何通过三级导航组件搭建双导航页面

更新时间:

如何通过三级导航组件搭建双导航页面。

背景信息

image.png

当您在开发应用的过程中,需要用到双导航(既有头部导航又有侧边导航)时,添加三级导航组件,可配置固定顶部导航与侧边导航。

前提条件

  • 登录Mobi

  • 已创建导航组。

操作步骤

  1. 拖入【三级导航组件】:

image.png
  1. 顶部导航配置:一级导航:

image.png
  1. 左侧拖入【三级导航组件】:

image.png
  1. 侧边的【三级导航组件】配置:二级导航:

image.png
  1. 若有第三级页面,侧边的【三级导航组件】还可选择“渲染子导航”,即可显示下一层级的页面:

image.png
  1. 添加相应页面,并配置导航组,最多可设置三级导航:image.png

效果预览

  1. 如此页面包含三个一级导航,分别包含二级导航、三级导航:

image.png
  1. 根据所搭导航组,点击顶部的一级导航,会跳转到该分组下的第一个导航页面处,如图所示:显示二级导航2下一级的页面4:

image.png