之前一直都是用原生的tabbar但是自己使用的图标实在是太丑了，同时也想使用其他好看ui组件库做开发，我选用的是iview-weapp(直男审美)，今天主要说的是tabbar组件，首先使用方法也很简单在github链接https://github.com/TalkingData/iview-weapp把这个ui组件库下载下来，再把dist文件引入自己的项目中(dist文件跟pages文件同级)，好的这样就能使用iview-weapp组件库啦，接下来我们需要用到什么组件就在页面对应的.json文件里按需引入就可以了，下面我使用tabbar组件当个例子（建议打开这个链接https://weapp.iviewui.com/docs/guide/start看着文档操作）

然后我们在wxml文件里这样引用

当然仅仅这样肯定还是不行的，我们还需要在js文件里这样写

这个是默认值，默认选中的是第一个tabbar-item

这个是点击tabbar-item的时候获得选中的状态
好的这样我们项目里tabbar就能正常使用了但是问题来了，为啥文档没告诉我怎么跳转啊

这也太难受了，百度了好久也没找到答案(这也是我写这个文章的目的，希望能帮助到大家)然后我就去看了微信小程序的开发文档https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/component.html，看到Component 构造器这个东西貌似可以帮助我解决这个问题(文档还是很强的，建议多看)，下面是解决方法：
首先我们需要在pages目录下创建一个component目录

然后在component目录下创建三个用来跳转的子页面(名字自己看着取)

子页面对应的.json文件需要这样写

子页面对应的js文件需要这样写
var app = getApp();

Component({

/* 开启全局样式设置 */
options: {
addGlobalClass: true,
},

/* 组件的属性列表 */
properties: {
name: {
type: String,
value: ‘cost’
}
},

/* 组件的初始数据 */
data: {

},

/* 组件声明周期函数 */
lifetimes: {
attached: function () {

},
moved: function () {

},
detached: function () {

},

},

/* 组件的方法列表 */
methods: {

}

})
然后子页面对应的wxml与wxss页面就写需要的样式就行了。
接下来我们要在我们放tabbar组件的index.wxml文件里这样写

使用hidden来判断显示我们创建的子页面(组件)
当然我们也还要在index.json引入我们的三个子页面

这样我们的tabbar跳转就完成啦
成功案例：



这样的跳转页面也不会闪烁一下哦，如果你使用其他ui组件库用同样的方法也可以实现tabbar跳转呢，也可以自己写一个自定义tabbar(挺简单的)，很少发文有问题请指出，写的不好请见谅。
对了有些小伙伴说就是加载首页数据的时候 另外两个页面的数据也提前渲染了，有些业务逻辑是点击其他页面的时候页面的数据会刷新，我就不放代码上来了。提供个思路：下面的菜单按钮是可以监听的，可以用监听来解决，文档里有(多看文档)。