二级底部导航栏（自定义底部导航栏带气泡）

不知道大家有没有遇到过这种情况，第一个页面用的系统的底部导航栏，那么跳转到另外一个页面的时候，也需要一个底部导航啦，这里就不能使用系统的底部导航栏了，所以这个时候，我们就需要自己定义一个底部导航栏。

第一个页面只做一个跳转

 第二个页面有底部显示：

main.js代码：

import home from './pages/secondTabbar/home/home.vue'
Vue.component('home', home)

import extend from './pages/secondTabbar/extend/extend.vue'
Vue.component('extend', extend)

import mine from './pages/secondTabbar/mine/mine.vue'
Vue.component('mine', mine)

代码有点多，所有代码可以到这里下载：https://download.csdn.net/download/wy313622821/56269931https://download.csdn.net/download/wy313622821/56269931https://download.csdn.net/download/wy313622821/56269931

子控件页面的生命周期：

mounted相当于onload，destroyed 相当于onUnload 监听页面卸载

beforeCreate      实例已经开始初始化之后调用 【数据初始化未完成，页面没有开始渲染】
created           实例创建完成之后调用 【组件创建完成，不代表组件已挂载到页面】
beforeMount       在挂载开始之前被调用。        
mounted           挂载到实例上去之后调用。 注意：此处并不能确定子组件被全部挂载，
　　　　　　　　　　 如果需要子组件完全挂载之后在执行操作可以使用$nextTickVue官方文档  
      
beforeUpdate    数据更新时调用，发生在虚拟 DOM 打补丁之前。    仅H5平台支持    
updated         由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。    仅H5平台支持    
beforeDestroy   实例销毁之前调用。在这一步，实例仍然完全可用。        
destroyed       Vue实例销毁后调用。调用后，Vue实例指示的所有东西都会解绑定，所有的事件监听器会被移除，
　　　　　　　　　　所有的子实例也会被销毁。