小程序tabbar选中icon不显示

最新推荐文章于 2024-10-30 14:21:08 发布

原创最新推荐文章于 2024-10-30 14:21:08 发布 · 2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序 #小程序tabbar选中icon不显示

小程序专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一个小程序中tabBar选中图标不显示的问题，原因是由于开发者在app.json配置文件中的tabBar设置存在错误，导致图标无法正常显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

其实这是一个乌龙问题，自己写的字段有问题。app.json中的tabBar配置

正确写法：tabBar.list[1].selectedIconPath
错误写法：tabBar.list[1].selectedPath

{
  "pages": [
    "pages/recommend/recommend",
    "pages/tea/tea",
    "pages/contact/contact",
    "pages/add/add",
    "pages/agricultural-vice/agricultural-vice"
  ],
  "window": {
    "backgroundTextStyle": "dark",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "信阳茶业",
    "navigationBarTextStyle": "black"
  },
  "sitemapLocation": "sitemap.json",
  "permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    }
  },
  "tabBar": {
    "position": "bottom",
    "list": [
      {
        "pagePath": "pages/recommend/recommend",
        "text": "推荐"
      },
      {
        "iconPath": "assets/img/tea.png",
        "selectedIconPath": "assets/img/tea.png",
        "pagePath": "pages/tea/tea",
        "text": "茶"
      },
      {
        "pagePath": "pages/add/add",
        "text": "+"
      },
      {
        "pagePath": "pages/agricultural-vice/agricultural-vice",
        "text": "农副"
      },
      {
        "iconPath": "assets/img/advisory.png",
        "selectedIconPath": "assets/img/advisory.png",
        "pagePath": "pages/contact/contact",
        "text": "咨询"
      }
    ]
  }
}