tabBar设置底部菜单栏及iconPath图标

1.底部菜单栏

在使用各种软件或者小程序时，在底下都会有菜单栏供我们切换场景，这种是如何实现的呢？

例如：

这时就需要使用到 pages.json 中的 tabBar 属性了

1.1 tabBar

这些就是在tabBar中常用的属性

1.1.1 list

使用list属性可以实现列表，但最少需要2个值，且最多不超过5个

所以只适合少量列表的使用

此时在这里写上一个list属性，因为他是多个内容，所以写上 [ ] 表示是一个数组

此时再写上花括号来区分，这样就可以代表每个花括号里面的都为一个页面了

pagePath：表示页面路径                text：表示菜单栏文本

这样就可以实现菜单栏了，并且由于地址值是存在的，所以点击这几个也可以实现跳转页面 

1.1.1.1 color

根据上面的代码已经实现了菜单栏，但是其他的样式也是可以更改的

比如color：颜色

只需要加上color属性，并在后面写上想要的颜色即可实现

注：仅是在点击之前的颜色，点击之后的颜色并不是由color来定义

此时设置的是蓝色

可以看到，未选中的颜色确实变成了蓝色，而选中的并未变色

1.1.1.2 selectedColor

selectedColor：选中后的颜色

设置一个红色

1.1.1.3 iconPath

未选择时的图标

现在为每个都设置了图标

可以看到，未选中的图片都展示出来了，而选中的图片并未展示

因为选中的照片并不是这个属性

1.1.1.4 selectedIconPath

选中后的图标，离开后会变回之前的图标

现在为每个都设置了一个属性

所以当我选择《分类》后，他的图标就变成了另一个

1.1.4 backgroundColor

backgroundColor：背景颜色

1.1.5 borderStyle

在小程序中可以看到这上面其实是有一个边框的，使用这个属性就可以改变他的颜色

此时设置了一个white的值

此时边框就已经看不见了，因为背景同样是白色的

注：这个属性只有black 和 white 两个值，所以并不是真正意义上的隐藏

只是改变颜色让他看不见而已