泉州网站设计找哪家,做外贸上哪些网站,常州市网站优化,教务处教务网络管理系统现场还原
在设置微信小程序底部tabBar导航图标时#xff0c;无论如何操作均无法显示在界面上 解决思路
问题1 图标类型
一开始以为不支持png类型#xff0c;但查看官方API仅提示ICON尺寸大小
打开其他项目可以正常展示#xff0c;排除图标类型问题
iconPath string 否 …现场还原
在设置微信小程序底部tabBar导航图标时无论如何操作均无法显示在界面上 解决思路
问题1 图标类型
一开始以为不支持png类型但查看官方API仅提示ICON尺寸大小
打开其他项目可以正常展示排除图标类型问题
iconPath string 否 图片路径icon 大小限制为 40kb建议尺寸为 81px * 81px不支持网络图片。 当 position 为 top 时不显示 icon。问题2 图标路径设置问题
按住ctrl 和 鼠标左键点击 均可跳转查看对应图标 说明资源路径无问题 iconPath : /images/b_2.png,iconPath : images/b_2.png,问题3 pages和tabBar中定义第一个页面不一致
有网友描述是 app.json中pages中的第一个页面不是tabBar配置中list[0]的第一个页面而导致
模拟示例 pages:[pages/index/index,pages/welcome/welcome,pages/cart/cart,pages/type/type,pages/details/details,pages/home/home,pages/logs/logs],tabBar: {color: #AAAAAA,selectedColor: #F20A0A,borderStyle: black,backgroundColor: #ffffff,list: [{pagePath: pages/type/type,text: 类型,iconPath : /images/b_2.png,selectedIconPath : /images/b_5.png},{pagePath: pages/index/index,text: 首页,iconPath : images/b_1.png,selectedIconPath : images/b_5.png},{pagePath: pages/details/details,text: 详情,iconPath : images/b_3.png,selectedIconPath : images/b_5.png},{pagePath: pages/cart/cart,text: 购物车,iconPath : images/b_4.png,selectedIconPath : images/b_5.png},{pagePath: pages/home/home,text: 我的,iconPath : images/b_5.png,selectedIconPath : images/b_5.png}]},效果展示
顺序互不干涉 是可以显示的 问题4 真机调试图片超200K或文件超上限2M
真机调试文件超2MmessageError: 代码包大小为2100 kb上限为 2048 kb请删除文件后重试。
如果小程序端文件超大。如果是在4M以内可以更换微信开发者版本解决。
详情 - 本地设置勾选 - 预览及真机调试时主包、分包体积上限调整为4M问题5 重启微信开发者工具
比较尴尬的是一顿操作猛如虎,一看战绩零杠五
上面所有的操作全部执行了一遍后点击刷新界面小程序还是无反应
后面不小心勿关了编辑工具重启后发现一切又正常啦
总结
可能是以下几个原因导致底部tabBar不显示图标 图标路径错误请检查图标路径是否正确建议使用相对路径。 图标大小不符合要求请确保图标大小符合微信小程序的要求建议使用官方提供的图标模板。 tabBar配置错误请检查tabBar的配置是否正确包括图标路径、选中态图标路径、文字等。 页面路径错误请检查页面路径是否正确如果路径错误可能会导致tabBar不显示。所指向的页面未进行页面注册。 编程界玄学薛定谔的bug 重启软件或电脑 解决99%问题
