微信小程序自定义tabbar；禁用某个tab；修改某个tab的样式

微信小程序自定义tabbar；禁用某个tab；修改某个tab的样式

原本使用本身的tabBar就已经很舒服了，很合适了的，但是总有一些脑洞大开的产品和客户，给你搞点多样式，没办法牛马就得去做咯，现在就给大家说说这个自定义tabbar的做法

无论使用uniapp开发微信小程序还是原生微信小程序的开发，都建议使用微信小程序本身的自定义tabbar组件来进行开发，连uniapp官网都说了使用这个自带的组件custom-tab-bar

微信小程序自定义tabbar组件文档：https://developers.weixin.qq.com/miniprogram/dev/framework/ability/custom-tabbar.html

可以看到，如果使用uniapp开发，可以直接使用custom-tab-bar，uniapp编辑器会自动把这个组件给复制过去，可以安心使用。

一、获取custom-tab-bar

打开上面的组件文档，找到下面的示例代码位置，点击预览效果，然后把打开的代码里面的组件（四个文件都要过去，直接把文件夹custom-tab-bar复制就好了）复制你的项目的根目录上面

二、配置新项目

我是在每个tab页进行添加的，

{
   
    "page":[
        {
   
			"path": "page/component/index",
			"style": {
   
				"navigationBarTitleText": "tab1",
				"enablePullDownRefresh": false,
				"navigationStyle": "custom"
			},
			"usingComponents": {
   } //------------修改点1
		},
        .......
    ],
  "tabBar": {
   
    "custom": true, //----------------------------------------修改点2
    "color": "#000000",
    "selectedColor": "#000000",
    "backgroundColor": "#000000",
    "list": [{
   
      "pagePath": "page/component/index",
      "text": "tab1"
    }, {
   
      "pagePath": "page/API/index",
      "text": "tab2"
    },
    {
   
      "pagePath": "page/API/index",
      "text": &#