今天打算开始实战一个微信小程序项目,一开始就踩坑了,正确设置了TabBar,但是TabBar就是不能显示出来,后面才找到原因,这里记录下:

app.json正确代码:

{
"pages":[
"pages/index/index",
"pages/leader/leader",
"pages/leader/stories/stories",
"pages/leader/authors/authors",
"pages/stack/stack",
"pages/stack/booklist/booklist",
"pages/stack/booklist/bookdetail/bookdetail",
"pages/bookdesk/bookdesk",
"pages/mine/mine",
"pages/mine/news/news",
"pages/logs/logs"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "网易蜗牛读书",
"navigationBarTextStyle":"black"
},
"tabBar":{
"color":"#999999",
"selectedColor":"#444444",
"backgroungColor":"#ffffff",
"borderStyle":"#e0e0e0",
"list": [
{
"pagePath":"pages/leader/leader",
"iconPath": "assets/icons/lingdu.png",
"selectedIconPath": "assets/icons/lingdu_sel.png",
"text":"领读"
},
{
"pagePath":"pages/stack/stack",
"iconPath": "assets/icons/stack.png",
"selectedIconPath": "assets/icons/stack_sel.png",
"text":"分类"
},
{
"pagePath": "pages/bookdesk/bookdesk",
"iconPath": "assets/icons/bookdesk.png",
"selectedIconPath": "assets/icons/bookdesk_sel.png",
"text":"书桌"
},
{
"pagePath":"pages/mine/mine",
"iconPath": "assets/icons/mine.png",
"selectedIconPath": "assets/icons/mine_sel.png",
"text":"我的"
}
]
}
}

这里注意显示解决有两种方式:

1.pages里的首个页面必须在list数组里有配置,所以在lists数组里加一个字典对象即可。

{
"pagePath":"pages/index/index",
"iconPath": "assets/icons/index.png",
"selectedIconPath": "assets/icons/index_sel.png",
"text":"首页"
}

但是我的TabBar又不想有这个item显示,这里看第二种解决办法。

2.pages数组的第一项必须是tabBar的list数组的一员:

这里有个疑惑:

百度了解决方法,显示将list数组加了index的模块item,后面不想要index模块在TabBar显示,然后又删除再运行,问题就解决了,也没有设置pages数组的第一项必须是tabBar的list数组的一员。

解决了就好,知道的大神可以留言告诉我哟!

微信小程序--TabBar不出现的更多相关文章

  1. 微信小程序tabbar设置样式在哪里改

    微信小程序tabbar通俗点说就是底部导航,我们一般会配置相关的菜单,方便读者快速导航.tabbar是在项目根目录中的配置文件 app.json 中进行设置:如果小程序是一个多 tab 应用(客户端窗 ...

  2. 微信小程序tabBar与redirectTo 或navigateTo冲突

    微信小程序tabBar与redirectTo 或navigateTo冲突 tabBar设置的pagePath无法再次被redirectTo或navigateTo引用 导致跳转失败,更改为swithTa ...

  3. 微信小程序tabBar 不显示底部菜单的原因和解决方法

    1,书写,正确书写时tabBar,不要写成tabbar!!! 2,当创建新工程时,app.json中Pages配置是这样的 ,,[图1], 注意:微信小程序里面的json文件时不能注释的,图中只是给读 ...

  4. 微信小程序tabBar显示问题

    在微信小程序的开发中,我遇到疑惑如下: 在app.json中定义了多个pages,一般微信小程序启动的时候,自动加载pages下的第一个页面, "pages": [        ...

  5. 微信小程序~TabBar底部导航切换栏

    底部导航栏这个功能是非常常见的一个功能,基本上一个完成的app,都会存在一个导航栏,那么微信小程序的导航栏该怎么实现呢?经过无数的踩坑,终于实现了,好了,先看看效果图. 对于底部导航栏,小程序上给出的 ...

  6. 微信小程序tabBar的一个小坑

    开始接触微信小程序的项目开发时,自己想添加底部导航,按照文档的方法在app.json添加tabBar,结果编译不出,工具台也没错误提示. 尝试在网上搜一下,看到有碰到类似情况的,解决方法是:app.j ...

  7. 微信小程序 tabBar模板

    tabBar导航栏 小程序tabBar,我们可以通过app.json进行配置,可以放置于顶部或者底部,用于不同功能页面的切换,挺好的... 但,,,貌似不能让动态修改tabBar(需求:通过switc ...

  8. 微信小程序 - tabbar动态更换图标以及文字

    大家不喜欢小程序的tabbar原因之一就是它太死板,tabbar一旦在app.json定义以后文字不能改,图标不能改! 我要自制tabbar!!! 其实在微信更新完1.9.0基础调试以后就推出了更新方 ...

  9. 异常:微信小程序tabBar不生效

    app.json全局tabBar设置tabBar不显示 由于小程序的机制问题,首页的tabBar第一个导航必须是首页 "pages": [ "pages/index/in ...

随机推荐

  1. 【图文教程】Vmware Workstation 12虚拟机中安装CentOS 7详细步骤

    文档维护人:牛棚琐思 <viprs@qq.com> ,如有不妥之处,请不吝赐教. 文档目标:帮助新手在Vmware虚拟机软件中安装CentOS 7超详细教程. 目标人群:本篇教程比较简单, ...

  2. Robot Framework--变量

    Robot Framework的变量分为标量, 列表和字典, 分别使用语法格式 ${SCALAR}, @{LIST} 和 &{DICT} 来定义. 此外, 环境变量可以直接使用语法 %{ENV ...

  3. CentOS7.x安装mariadb-10.3

    1.配置mariadb yum源 vim /etc/yum.repos.d/mariadb.repo # 写入如下内容 [mariadb] name = MariaDB baseurl = http: ...

  4. Unity Platform Differernces

    https://docs.unity3d.com/560/Documentation/Manual/SL-PlatformDifferences.html

  5. vue 仿新闻项目笔记

    1.main.js: import filters from 'XXX' Object.keys(filters).forEach(key => Vue.filter(key, filters[ ...

  6. 记录 ubuntu 安装中文语言出现 software database is broken

    在终端下执行 sudo apt-get install  language-pack-zh-han* 然后去语言中心设置中文,并全局使用即可.

  7. 微信小程序学习记录(一)

    如何定义一个全局变量: 1,在根目录下app.js中添加 App({ globalData: { g_isPlayingMusic : false, g_currentMusicPostId :nul ...

  8. 02_Tutorial 2: Requests and Responses 请求和响应

    1.请求和响应 1.文档 https://www.django-rest-framework.org/tutorial/2-requests-and-responses/ https://q1mi.g ...

  9. Mac 升级 Python2.7 到 Python3.5

    1.去 Python 官网下载一个版本的包 https://www.python.org/downloads/mac-osx/ 2.安装之后,去  /Library/Frameworks/Python ...

  10. sql server 事务和锁的作用

    事务 事务就是作为一个逻辑工作单元的SQL语句,如果任何一个语句操作失败那么整个操作就被失败,以后操作就会回滚到操作前状态,或者是上个节点.为了确保要么执行,要么不执行,就可以使用事务.而锁是实现事务 ...