微信小程序 自定义tabBar(底部导航栏)

微信小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。

在写本文章之前，发布过一篇 《说一说要求 小程序自定义导航栏 的产品有多沙雕》
文章地址：说一说要求 小程序自定义导航栏 的产品有多沙雕_黄河爱浪-CSDN博客_自定义标签沙雕
在文章中说明了自定义导航栏的诸多弊端，小编是坚决抵制自定义小程序导航栏的。但由于一些特殊原因不得不去自定义导航栏（比如要根据登录的用户权限增加或减少导航数量）。

本篇分享一下小编自己整理的一套 微信小程序 自定义tabBar 源码，及说明实现过程和分析相较与自定义组件式定位在底部导航的优点。

目前仅 微信小程序 是支持自定义导航栏的，可查看微信小程序官方文档，学习自定义tabBar的使用。

# 1、创建自定义导航栏 目录和文件

目录：微信文档有具体说明，可见下图

资源平台无法设置免费下载且被不懂的人瞎评论，所以删除了下载链接，请自行阅读微信文档

源码效果示例图：

# 2、优缺点：

相较与 自定义组件 定位在底部的方式，优缺点：

优点：

1. 拥有了多窗口的切换（这是非常重要的功能，自定义组件定位的方式是无法实现该需求的）；
2. 不会因为“下拉刷新”功能导致移动导航栏被移到窗口外的问题。

缺点：

1. 仍然无法实现“中间按钮凸出”的效果；
2. 实现过程相对复杂一些；

相较与 框架原生导航 的方式，优缺点：

优点：

1. 能够支持更多的自定义需求，比如动态的增删导航数量；

缺点：

1. 首次加载和增删导航数量后，更新时会有闪动和跳动的情况；

鱼和熊掌不可兼得，这应该是目前最佳的自定义方式了，框架原生导航依旧是最好的选择。小编也正在积极的探索一种实现更方便，效果更自由的，兼容更多小程序的方案，在不久，将会分享给大家。

作者：黄河爱浪 QQ：1846492969，邮箱：helang.love@qq.com

本文原创，著作权归作者所有，转载请注明原链接及出处。