{
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app"
}
},
{
"path": "pages/index/index0",
"style": {
"navigationBarTitleText": "uni-app000"
// "app-plus":{
// "titleNView":{
// "buttons":[
// {
// "type":"back",
// "color":"#333333",
// "text":"返回",
// "float":"left"
// }
// ]
// }
// }
}
},
{
"path": "pages/components/shitu",
"style": {
"navigationBarTitleText": "视图",
"navigationBarBackgroundColor":"#333333",
"navigationBarTextStyle":"white",//导航字体颜色
"enablePullDownRefresh":true,//是否下拉刷新
"navigationStyle":"default",//设置为custom导航栏消失
"app-plus": {
"bounce":"none",
// "animationType": "slide-in-right",
// "animationDuration": 300000,
"titleNView": {
"titleText":"设置视图文件",
"buttons":[
{
"type":"back",
"color":"#FFFFFF",
"float":"left"
},
{
"type":"share",
// "text":"\ue534",
"colorPressed":"#c8000a",
"color":"#FFFFFF",
"float":"right",
"badgeText":"12",
"redDot":true
}
]
} }
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"tabBar":{
"color":"#4CD964",
"backgroundColor":"#333333",
"fontSize":"14px",
"height":"44px",
"selectedColor":"#007AFF",
"position":"bottom",
"list":[
{
"pagePath":"pages/components/shitu",
"iconPath":"static/logo.png",
"selectedIconPath":"static/logo.png",
"text":"组件"
},
{
"pagePath":"pages/index/index",
"iconPath":"static/logo.png",
"selectedIconPath":"static/logo.png",
"text":"API"
}
// ,
// {
// "pagePath":"pages/index/index0",
// "iconPath":"static/logo.png",
// "selectedIconPath":"static/logo.png",
// "text":"API01"
// }
]
}
}

描述:tabBar跳转的路由 默认header 是没有返回按钮的 只有其他方式跳转的页面 会显示返回键(tabBar默认是没有上一页所以 不需要显示返回键)

  如果想显示返回键 需要 自定义 顶部导航;

bug1:自定义导航(需要在页面利用onNavigationBarButtonTap方法监听其中要注意 当前方法 与data同级)如果利用 uni.navigateTo返回(tabBar其中的路径会报错:navigateTo:fail can not navigateTo a tabbar page)需要用到uni.switchTab才可以跳转;

        onNavigationBarButtonTap(e) {
console.log(this)
console.log(this.$mp)
uni.switchTab({
url: '/pages/index/index'
})
// uni.navigateBack({
// delta: 2
// });
// history.back(2)
// this.$router.history.go(-1)
}

uni-app tabBar 踩坑的更多相关文章

  1. Uber使用Swift重写APP的踩坑经历及解决方案(转载)

    本文出自Uber移动架构和框架组负责人托马斯·阿特曼于2016年在湾区Swift峰会上的演讲,分享了使用Swfit重写Uber的好与坏.以下为译文: 我是托马斯·阿特曼,目前是Uber移动架构和框架组 ...

  2. 我的微信小程序入门踩坑之旅

    前言 更好的阅读体验请:我的微信小程序入门踩坑之旅 小程序出来也有一段日子了,刚出来时也留意了一下.不过赶上生病,加上公司里也有别的事,主要是自己犯懒,就一直没做.这星期一,赶紧趁着这股热乎劲,也不是 ...

  3. 微信小程序之mpvue+iview踩坑之旅

    因为之前参照微信的原生的文档写过一些小程序的demo,写的过程比较繁琐,后来出了美团的mpvue,可以直接使用vue开发,其他的不作对比,这篇文章记录一下踩坑之旅. 参照mpvue http://mp ...

  4. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  5. apicloud踩坑集锦

    最近在用apicloud开发,这里录入一些踩坑的地方,从头到尾,要多尴尬有多尴尬,新入app开发,记录一些心得,和遇到的坑以及解决办法. 1,apicloud 打包的Android app ,打开fr ...

  6. Xcode11.1 踩坑备忘录

    Xcode11.1 踩坑备忘录(mac系统10.15) 1 .环信ChatDemo2.0报错 这是环信ChatDemo2.0报错 NSInteger numberOfBeforeSection = [ ...

  7. 【踩坑速记】二次依赖?android studio编译运行各种踩坑解决方案,杜绝弯路,总有你想要的~

    这篇博客,只是把自己在开发中经常遇到的打包编译问题以及解决方案给大家稍微分享一下,不求吸睛,但求有用. 1.大家都知道我们常常会遇到dex超出方法数的问题,所以很多人都会采用android.suppo ...

  8. JavaScript 踩坑心得— 为了高速(下)

    一.前言 本文的上一篇 JavaScript 踩坑心得- 为了高速(上) 主要和大家分享的是 JavaScript 使用过程中的基本原则以及编写过程中的心得分享,本文主要和大家聊聊在各个使用场景下的 ...

  9. JavaScript 踩坑心得— 为了高速(上)

    一.前言 很多情况下,产品的设计与开发人员一直想打造一套高品质的解决方案,从而快速.平稳地适应产品迭代.速度是衡量产品适应性的真正且唯一的标准,而且,这并不是笔者的一家之言. 「速度是衡量适应能力的真 ...

随机推荐

  1. Jquery table相关--工时系统

    1.jquery 的弹出对话框,单击事件之后 if (confirm("确定要删除?")) { // //点击确定后操作 } 2.对某个table中的checkbox是否被选中的遍 ...

  2. sql--ALTER

    ALTER TABLE 语句 ALTER TABLE 语句用于在已有的表中添加.修改或删除列. SQL ALTER TABLE 语法 如需在表中添加列,请使用下列语法: ALTER TABLE tab ...

  3. bash脚本测试总结

    bash脚本测试总结   跟踪脚本的执行 可以让bash打印出你脚本执行的过程中的所有语句.这很简单,只需要使用bash的-x选项就可以做到,下面让我们来看一下.   下面的这段脚本,先是输出一个问候 ...

  4. calc,support,media各自的含义及用法

    @support:用于检测浏览器是否支持CSS某个属性,即条件判断,如果支持某个属性,可以写一套样式,如果不支持某属性,提供另一套样式作为替补. calc():用于计算动态函数值,支持“+”,“-”, ...

  5. 创建全文索引----SQLserver

    1.启动 Microsoft Search 服务 开始菜单-->SQL程序组-->服务管理器-->下拉筐-->Microsoft Search 服务-->启动它. 2. ...

  6. java8学习之Collector源码分析与收集器核心

    之前已经对流在使用上已经进行了大量应用了,也就是说对于它的应用是比较熟悉了,但是比较欠缺的是对于它底层的实现还不太了解,所以接下来准备大量通过阅读官方的javadoc反过来加深对咱们已经掌握这些知识更 ...

  7. 【bzoj 4059】Non-boring sequences

    这题的重点不在于代码,而在于复杂度分析…… 首先我们肯定会写 $n^2$ 暴力,就是每次暴力扫 $[l,r]$ 区间,找到任意一个在此区间中只出现过一次的数.设其下标为 $mid$,显然在这个区间中任 ...

  8. npm安装node-sass报msbuild相关错误的解决办法

    转自:https://blog.csdn.net/Amio_/article/details/87931733 https://www.cnblogs.com/diffx/p/10510868.htm ...

  9. eclipse编码格式(中文乱码)

    https://jingyan.baidu.com/article/2009576193ee38cb0721b416.html 修改工作空间默认编码 1 进入Eclipse,导入一个项目工程,如果项目 ...

  10. IView 给Submenu增加click事件失效解决方案

    在浏览器中,打开开发者选项(F12) 找出对应的class,给其添加一个点击事件,就可以了. 具体的  document  操作,看这里 ----> https://www.cnblogs.co ...