小程序
小游戏
企业微信
微信支付
扫描小程序码分享
官方代码在本地开发工具调试,因为线上小程序出现了触底加载数据时,自定义tabbar上移,感觉是出现了两个tabbar的视觉效果。
调试基础库:2.21.2
为了搞清楚是不是真的有两份结构,缩小了tabbar查看到确实是这样的。
截图如下:
那么,现在可以怎么隐藏其中一个吗??wx.hideTabbar() 方法也没有用,提示报错。兄弟们有什么好的办法不???
调试基础库在 2.6.6及以下均是正常,高于这个版本就一直存在两层tabbar的问题。
2 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
/*
* 修改文件第一个类名
* /custom-tab-bar/index.wxss
*/
•
.tab-bar {
transform: scale(.5); /* 添加这个 */
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 48px;
background: white;
display: flex;
padding-bottom: env(safe-area-inset-bottom);
}
* 添加 transform: scale(.5);
* 如下所示就能看到模拟器上两层tabbar了,
我也遇到这种情况,但是不是上移错位,是上移多出了一个tabBar,记录一下
第一种:看自定义tabBar是不是和官方文档一样,app.json里面,custom:true.在新建custom-tab-bar文件夹下写的。如果这种情况,自定义文件的index.html 把里面的cover-view改成view就不会有双层tabBar了。
第二种:app.json里面,不是用custom:true写的。直接做组件写的。这种在app.js的onLaunch里面wx.hideTabBar()
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。
官方代码:https://developers.weixin.qq.com/s/jiSARvmF7i55
基础调试库选择:2.21.2
/*
* 修改文件第一个类名
* /custom-tab-bar/index.wxss
*/
•
.tab-bar {
transform: scale(.5); /* 添加这个 */
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 48px;
background: white;
display: flex;
padding-bottom: env(safe-area-inset-bottom);
}
/custom-tab-bar/index.wxss 这个文件修改
/*
* 添加 transform: scale(.5);
* 如下所示就能看到模拟器上两层tabbar了,
*/
.tab-bar {
transform: scale(.5); /* 添加这个 */
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 48px;
background: white;
display: flex;
padding-bottom: env(safe-area-inset-bottom);
}
我也遇到这种情况,但是不是上移错位,是上移多出了一个tabBar,记录一下
第一种:看自定义tabBar是不是和官方文档一样,app.json里面,custom:true.在新建custom-tab-bar文件夹下写的。如果这种情况,自定义文件的index.html 把里面的cover-view改成view就不会有双层tabBar了。
第二种:app.json里面,不是用custom:true写的。直接做组件写的。这种在app.js的onLaunch里面wx.hideTabBar()