小程序（三）配置tabbar及自定义tabbar样式

关于tabbar部分，官方文档是有明确的说明的，当然，我这里是不存在把官方文档给你复制一遍的情况。我大概把我再看官方文档过程中遇到的坑，大概复述一下。

一：配置tabbar

这个主要是使用小程序自带的tabbar，在项目根目录下的app.json中配置，这个简单配置一下就可以了。

这里放一下我的app.json配置：

更详细的tabbar配置属性说明，请移步官方文档《tabbar》

最后效果如下图所示：

二：自定义tabbar

有些时候，官方的样式并不能满足我们的要求，这个时候，我们就需要自定义tabbar的样式，当然，这个官方也是有说明的，只是，说明比较简单，官方给了一段示例代码。具体请移步官方文档《自定义tabbar》

然后，我这里大概分享下我是怎么写的：

App.json中，tabbar有一个custom属性，这个很重要，如果将这个属性设置为true，那么程序会默认使用自定义的tabbar。

那么我的app.json中的tabbar部分代码，就变成了下面的这个样子：

在小程序根目录下创建目录custom-tab-bar，名字一定要是这个，别瞎起名。

在目录中创建组件index，注意，这里一定要注意，这里创建的是组件，而不是页面，虽然他们都是四个文件，但是他们是完全不一样的。

创建成功之后，文件目录如下图所示：

然后，我们开始编写四个文件中的代码：

（1）：index.js

（2）：index.json

这里边本来我打算用weui的tabbar组件来着，但是目前还没玩明白，这个回头再说。

（3）：index.wxml