Skip to content

底部导航

功能介绍

底部导航用于在不同的功能模块之间进行快速切换。本功能允许插件开发者为各自的插件定义独立的底部导航结构,实现灵活的多模块导航体系

系统底部导航

系统底部导航文件位置:niucloud-core/src/main/resources/core/loader/diy/bottom.json 关键代码:

json
{
  "key": "app", //关键字,系统是app,插件对应插件名称
  "value": {
    "backgroundColor": "#ffffff",   //背景色
    "textColor": "#606266",        //文本颜色
    "textHoverColor": "#007aff",   //文本悬停颜色
    "type": "1",
    "list": [
      {
        "text": "首页",  //名称
        "link": {   //对应链接
          "parent": "SYSTEM_LINK",  //分组链接
          "name": "INDEX",  //链接名称
          "title": "首页",  //链接标题
          "url": "/app/pages/index/index"   //链接地址
        },
        "iconPath": "static/resource/images/tabbar/index.png",   //图标
        "iconSelectPath": "static/resource/images/tabbar/index-selected.png"   //选中图标   
      },
      {
        "text": "我的",
        "link": {
          "parent": "MEMBER_LINK",
          "name": "MEMBER_CENTER",
          "title": "个人中心",
          "url": "/app/pages/member/index"
        },
        "iconPath": "static/resource/images/tabbar/my.png",
        "iconSelectPath": "static/resource/images/tabbar/my-selected.png"
      }
    ]
  }
}

插件底部导航

插件底部导航文件位置:niucloud-addon/shop/src/main/resources/shop/loader/diy/bottom.json

底部导航配置之后,后台可以动态配置底部导航

基于 MIT 协议发布