事先申明，因为我是只在微信小程序下进行开发，所以下述内容都是基于微信小程序的。官方有定义教你怎么自定义TabBar，https://developers.weixin.qq.com/miniprogram/dev/framework/ability/custom-tabbar.html，那么在uni-app里怎么处理呢？dCloud也有提及：【微信小程序自定义tabbar：微信提供一直基于webview自定义tabBar的方案。该功能体验不佳，不太推荐使用。如果要使用，参考微信文档，项目根创建 custom-tab-bar 目录，注意里边的代码是 wxml,wxss，不是 vue，uni-app编译器会直接拷贝该目录到微信小程序中】参考：https://uniapp.dcloud.io/collocation/pages?id=tabbar
OK，回到开始，我们一步一步来
1、参考【https://developers.weixin.qq.com/miniprogram/dev/framework/ability/custom-tabbar.html】，在uniapp的目录下创建custom-tab-bar目录，创建：index.js/json/wxml/wxss文件（如果要偷懒，可以直接用官网上的示例工程打开，将文件复制过来即可）
2、配置pages.json，在原有的配置中增加：custom:true，当有这个值的时候。小程序将不会生成标准的tabbar。即使增加了这个KEY，原来配置中的list也不能去掉，毕竟，switchTab就是从tabbar.list中来进行判断的
3、打开工程，你会发现tabbar已经存在于每一个页面了。但这里会带来另一个问题，即：uni.hideTabbar()无效了（这个后面再说。。。）
4、官方例子中用了this.getTabbar。这个方法在UniApp是无法使用的，但可以曲线救国：this.$mp.page.getTabbar，将原来的判断全部改成这样就可以按照官方示例进行使用了。
5、如果在运行过程中，发现tabbar一直在闪烁，那么看一下你icon，是不是81px。我之前放的32px\48px的icon，都会导致tab切换的时候闪烁。换成81后就好了。