mint-ui中tabar内容跟随路由变换

2019-08-22  本文已影响0人  _孙小胖
<footer>
    <!--使用mint-ui中tabar-->
     <mt-tabbar v-model="message" fixed class="h2">
        <mt-tab-item id="/homeAndroid" >
          <i class="icon iconfont el-fontshouye1 index"></i>
          <p>首页</p>
        </mt-tab-item>
        <mt-tab-item id="/info" >
          <i class="icon iconfont el-fontxiaoxi2 info"></i>
          <p>消息提醒</p>
        </mt-tab-item>
        <mt-tab-item id="/Feature" >
          <i class="icon iconfont el-fontgongzuotai more"></i>
          <p>其他功能</p>
        </mt-tab-item>
        <mt-tab-item id="/Mine">
          <i class="icon iconfont el-fontyonghuguanli1 me"></i>
          <p>我的</p>
        </mt-tab-item>
      </mt-tabbar>
</footer>

data() {
    return{
        //选中的tabbar值message为外面页面传入的值selected
        message:this.$router.path,
    }
},
props: {
    selected: String,
},
watch: {
    meaagea: function(val,oldVal){
        this.message = val;
        this.$router.push(val);
    }
}
上一篇 下一篇

猜你喜欢

热点阅读