鍍金池/ 問答/HTML/ mint-ui的tabbar怎么默認(rèn)被選中呢

mint-ui的tabbar怎么默認(rèn)被選中呢

用了mint官網(wǎng)的tabbar和tabContainer。但是默認(rèn)不顯示第一個選項卡。必須點一下才顯示對應(yīng)的選項卡內(nèi)容.我給第一個選項卡加了一個is-selected的class名不好使。mint應(yīng)該有自己的默認(rèn)的方法吧?我在文檔里沒看到有寫。

<template>
  <div>
      <mt-tab-container v-model="selected">
            <mt-tab-container-item id="index">
                <mt-cell title="tab-container 1"></mt-cell>
            </mt-tab-container-item>
            <mt-tab-container-item id="news">
                <mt-cell title="tab-container 2"></mt-cell>
            </mt-tab-container-item>
            <mt-tab-container-item id="usercenter">
                <mt-cell title="tab-container 3"></mt-cell>
            </mt-tab-container-item>
        </mt-tab-container>
    <mt-tabbar v-model="selected">
        <mt-tab-item id="index" @click="reid()">
            <img slot="icon" src="">
            外賣
        </mt-tab-item>
        <mt-tab-item id="news">
            <img slot="icon" src="">
            訂單
        </mt-tab-item>
        <mt-tab-item id="usercenter">
            <img slot="icon" src="">
            我的
        </mt-tab-item>
    </mt-tabbar>

  </div>
</template>

<script>


export default {
    data(){
        return{
            selected:'',
            isActive:true,
            active:'is-selected'
        }
    },
    mounted(){
        // let icondiv = document.getElementsByClassName("mint-tab-item-icon")
        // console.log(icondiv)
        // icondiv[0].classList.add("iconfont icon-shouye")
        // icondiv[1].classList.add("iconfont icon-xinwen")
        // icondiv[2].classList.add("iconfont icon-xinwen")

    },
    methods:{
        reid(){
            console.log(this.value)
        }
    }
}
</script>

<style scoped lang="stylus">

</style>

默認(rèn)未被選中顯示空白
默認(rèn)加載后

點擊底部導(dǎo)航后
點擊底部導(dǎo)航以后

怎么才能設(shè)置默認(rèn)被選中呢

回答
編輯回答
入她眼

每一個mt-tab-item有1個id,mt-tabbarv-model綁定值等于id時即選中。設(shè)置你的selected默認(rèn)值為第一個mt-tab-itemid

2018年7月3日 10:43
編輯回答
近義詞

設(shè)置 selected:"1",就行了,此處"1"是我這里的,想要哪個顯示你就把下面 mt-tab-item id="1" 設(shè)置一下就行了

2017年8月5日 03:02