uni-app tabBar 踩坑
{
"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 踩坑的更多相关文章
- Uber使用Swift重写APP的踩坑经历及解决方案(转载)
本文出自Uber移动架构和框架组负责人托马斯·阿特曼于2016年在湾区Swift峰会上的演讲,分享了使用Swfit重写Uber的好与坏.以下为译文: 我是托马斯·阿特曼,目前是Uber移动架构和框架组 ...
- 我的微信小程序入门踩坑之旅
前言 更好的阅读体验请:我的微信小程序入门踩坑之旅 小程序出来也有一段日子了,刚出来时也留意了一下.不过赶上生病,加上公司里也有别的事,主要是自己犯懒,就一直没做.这星期一,赶紧趁着这股热乎劲,也不是 ...
- 微信小程序之mpvue+iview踩坑之旅
因为之前参照微信的原生的文档写过一些小程序的demo,写的过程比较繁琐,后来出了美团的mpvue,可以直接使用vue开发,其他的不作对比,这篇文章记录一下踩坑之旅. 参照mpvue http://mp ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
- apicloud踩坑集锦
最近在用apicloud开发,这里录入一些踩坑的地方,从头到尾,要多尴尬有多尴尬,新入app开发,记录一些心得,和遇到的坑以及解决办法. 1,apicloud 打包的Android app ,打开fr ...
- Xcode11.1 踩坑备忘录
Xcode11.1 踩坑备忘录(mac系统10.15) 1 .环信ChatDemo2.0报错 这是环信ChatDemo2.0报错 NSInteger numberOfBeforeSection = [ ...
- 【踩坑速记】二次依赖?android studio编译运行各种踩坑解决方案,杜绝弯路,总有你想要的~
这篇博客,只是把自己在开发中经常遇到的打包编译问题以及解决方案给大家稍微分享一下,不求吸睛,但求有用. 1.大家都知道我们常常会遇到dex超出方法数的问题,所以很多人都会采用android.suppo ...
- JavaScript 踩坑心得— 为了高速(下)
一.前言 本文的上一篇 JavaScript 踩坑心得- 为了高速(上) 主要和大家分享的是 JavaScript 使用过程中的基本原则以及编写过程中的心得分享,本文主要和大家聊聊在各个使用场景下的 ...
- JavaScript 踩坑心得— 为了高速(上)
一.前言 很多情况下,产品的设计与开发人员一直想打造一套高品质的解决方案,从而快速.平稳地适应产品迭代.速度是衡量产品适应性的真正且唯一的标准,而且,这并不是笔者的一家之言. 「速度是衡量适应能力的真 ...
随机推荐
- EJS学习(四)之语法规则下
模版函数 在 EJS 之外,提供了一些额外的模版函数来简化我们的一些工作 GIT:https://github.com/willerce/tmt-ejs-helper css()方法 快速的引用 CS ...
- JS基础_字面量和变量
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 关于memset的几个易错点
memset(void *s,int ch,size_t n); 作用:将s中当前位置后面的n个字节用 ch 替换并返回 s 注意这里是“字节”而非单位长度,memset不会考虑各个类型的单位长度,只 ...
- 帝国 cms 修改登录次数的两种方法
1.找到数据库表 注:我把这里的5改成50了. 2.找打e ==>> config ==>> config.php ==>> loginnum的5修改一下即可
- 解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
问题截图: 解决方案: 1.打开File --> Setting 窗口 2.搜索 Webpack 3.选择如下路径 问题解决
- 丑陋的 shell 来一遍
学习使人进步,好记性不如烂笔头 在线正则 在线正则 ^(.)(.).*?\2\1$ 正式开始总结 cat 反过来读取文件 tac file.txt nl --> number line 如 ca ...
- Oracle创建表和创建序列和修改,增加sql字段
一.创建表 create table y_parts_classify( pt_id number(10) not null, pt_name varchar2(1000), update_time ...
- laravel 使用 intervention/image 的注意方法
出错NotSupportedException in AbstractEncoder.php line 151: Encodingformat (tmp) is not supported. 这个只是 ...
- python、mysql三-3:完整性约束
一 介绍 约束条件与数据类型的宽度一样,都是可选参数 作用:用于保证数据的完整性和一致性主要分为: PRIMARY KEY (PK) 标识该字段为该表的主键,可以唯一的标识记录 FOREIGN KEY ...
- Linux fing cd 查找文件/文件夹并进入目录命令
查找文件|文件夹并进入目录命令:cd $() [root@localhost /]# cd $(dirname "`find / -name 'ifcfg-ens33'`") // ...