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!?

  • 相关阅读:
    遇到屏蔽selenium的站点如何突破
    subprocess.Popen stdout重定向内容实时获取
    thinkphp Composer安装指南
    职场片
    php。。。
    多线程相关
    狂刷1000题~~2
    狂刷1000题~~1
    关于eclipse中看不到源码的问题
    一篇看懂++i i++
  • 原文地址:https://www.cnblogs.com/guxin/p/weixin-miniapp-tabbar-can-not-display.html
Copyright © 2011-2022 走看看