vue3 && uni-app 中小程序实现 底部tabbar 中间凸起部分 或者说自定义底部tabbar [保姆级别教程]
创始人
2024-11-05 17:13:51

1、先来看一下效果

2、代码实现  我们还是在 pages.json  中正常配置我们底部的tabbar 但是需要 添加一个字段 "custom": true, //开启自定义tabBar  不填每次原来的tabbar在重新加载时都回闪现

3、 在 pages同一级 或者 里面创建一个 子组件 用来放我们的模版 

4、 在 main.js中添加导入组件的配置 

5、在需要用到底部tabbar的页面中引入组件

6、运行起来后可能会报一个错误 这时候我们需要在 project.config.json 文件中的 setting 中添加两个字段的配置

7、添加配置

8、重新运行一下就可以了 样式大家自己调整 

相关内容

热门资讯

裸辞做“一人公司”,我后悔了 去年这个时候,一位以色列程序员正在东南亚旅行。他顺手把一个在脑子里转了很久的想法做成了产品,一个让任...
南京建成国内首个Pre-6G试... 4月21日,2026全球6G技术与产业生态大会在南京开幕。全息互动技术展台前,一名远在北京的工作人员...
超梵求职受邀参加“2025抖音... 超梵求职受邀参加“2025抖音巨量引擎成人教育行业生态大会”,探讨分享优质内容传播,服务万千学员。 ...
摩托罗拉Razr 2026(R... IT之家 4 月 22 日消息,摩托罗拉宣布新一代 Razr 折叠手机将于 4 月 29 日在美国发...
库克卸任,特纳斯领航:苹果新纪... 苹果首席执行官蒂姆·库克将卸任,硬件工程主管约翰·特纳斯将接任,苹果公司今天宣布此事。 库克将在夏季...