美文网首页
uniapp 怎样添加tabbar

uniapp 怎样添加tabbar

作者: 帅炸天的程序员 | 来源:发表于2020-06-12 21:26 被阅读0次

一、准备icon

1、找需要的图标

https://www.iconfont.cn/ 到阿里开源的图标站找自己需要的图标

2、放到需要的文件夹

下载到项目文件目录
我个人习惯是新建static目录,将图标放到里面去


static目录

二、app.json 配置文件添加"tabBar" key


"tabBar": {
    "color": "#7A7E83",
    "selectedColor": "#3cc51f",
    "borderStyle": "black",
    "backgroundColor": "#F8F8F8",
    "list": [
      {
        "pagePath": "pages/component/index/index",
        "iconPath": "static/calculator.png",
        "selectedIconPath": "static/calculator_selected.png",
        "text": "主页"
      },
      {
        "pagePath": "pages/component/logs/logs",
        "iconPath": "static/mine.png",
        "selectedIconPath": "static/mine_selected.png",
        "text": "我的"
      }
    ]
  },

相关文章

网友评论

      本文标题:uniapp 怎样添加tabbar

      本文链接:https://www.haomeiwen.com/subject/ttnntktx.html