zoukankan      html  css  js  c++  java
  • 【微信小程序】tabBar的显示问题

    tabBar不显示

    在app.json中配置了4个页面,在tabBar的list中随意写了两个页面,编译后发现不能显示tabBar。

    {
      "pages": [
        "pages/musicList/musicList",
        "pages/test/test",
        "pages/index/index",
        "pages/logs/logs"
      ],
    
      "window": {
        "backgroundTextStyle": "light",
        "navigationBarBackgroundColor": "#0094ff",
        "navigationBarTitleText": "本地音乐库",
        "navigationBarTextStyle": "white"
      },
    
        "tabBar": {
            "list": [
                {
                    "pagePath": "pages/index/index",
                    "text": "首页",
                    "iconPath": "images/game.png"
                },
                {
                    "pagePath": "pages/logs/logs",
                    "text": "日志"
                }
            ]
        }
    }

    原因:pages中第一项是小程序的起始页面,起始页面必须要在tabBar中,tabBar才能显示出来!


    tabBar的小图标iconPath不显示

    tabBar中起始页面设置的小图标iconPath无法显示,但其他页面的小图标都能正常显示。

    代码如下:

    {
      "pages": [
        "pages/musicList/musicList",
        "pages/test/test",
        "pages/index/index",
        "pages/logs/logs"
      ],
    
      "window": {
        "backgroundTextStyle": "light",
        "navigationBarBackgroundColor": "#0094ff",
        "navigationBarTitleText": "本地音乐库",
        "navigationBarTextStyle": "white"
      },
    
        "tabBar": {
            "position":"bottom",
            "list": [
                {
                    "pagePath": "pages/logs/logs",
                    "text": "播放中",
                    "iconPath": "images/game.png"
                },
                {
                    "pagePath": "pages/test/test",
                    "text": "音乐列表",
                    "iconPath": "images/list.png"
                },
                {
                    "pagePath": "pages/musicList/musicList",
                    "text": "播放中",
                    "iconPath": "images/game.png"
                }
            ]
        }
    }

    发现无论把起始页面发在list中的第几项,它的小图标都不能显示出来,如下图:

    但是在真机上扫码测试,发现并没有这个问题。看来这个是编辑器Bug!?

  • 相关阅读:
    GDUFE ACM-1087
    背包九讲
    OJ4TH|Inverse number:Reborn
    OJ4TH|Let's play a game
    GG第四次作业
    OpenCV(3)其他常用数据类型
    OpenCV学习(2)读取视频和摄像头
    OpenCV(1)读写图像
    GG第三次作业
    GG第二次作业
  • 原文地址:https://www.cnblogs.com/guxin/p/weixin-miniapp-tabbar-can-not-display.html
Copyright © 2011-2022 走看看