如何详细适配uni-app中的微信小程序自定义tabBar？

本文共计1324个文字，预计阅读时间需要6分钟。

引言：此方法适用于大部分微信小程序支持的功能，但在uni-app文档中未找到相关API的详细说明。需要在微信小程序中实现一个中间弹出显示的异形导航栏。

实现方法设计：

1.使用微信小程序的视图组件（如view、scroll-view等）来构建导航栏的结构。

2.通过CSS样式设计导航栏的异形外观。

3.使用微信小程序的动画API实现导航栏的弹出效果。

4.在页面加载或特定事件触发时，调用动画API使导航栏从中间弹出显示。

引言：此方法可用作大部分微信小程序支持，但uni-app文档中却找不到相关说明的API

需求

需要在微信小程序中，实现一个中间图标突出显示的异形导航栏。

如下图

实现方法设计

要做这种异形的导航栏，用直接在配置文件里面写list的方法肯定做不到。那么，就有以下两种可替代方法。

1. 在每一个页面都加载一个tabBar组件，与页面同时渲染。
2. 设置自定义tabBar,修改tabBar的样式。

优缺点分析：方法1实现起来略为简单，但是会出现代码可重用率低，降低性能，已经界面跳动等问题。