mint-ui的navbar导航栏的填坑

• mint-ui的navbar导航栏的填坑

• 用官方的demo直接导入到项目中有问题

  1、引入

  
  import { Navbar, TabItem } from 'mint-ui';  //导航栏
  
    import { TabContainer, TabContainerItem } from 'mint-ui';//Item
  
    import { Cell } from 'mint-ui';
  
  Vue.component(Navbar.name, Navbar);
  
    Vue.component(TabItem.name, TabItem);
  
    Vue.component(TabContainer.name, TabContainer);
  
    Vue.component(TabContainerItem.name, TabContainerItem);
  
    Vue.component(Cell.name, Cell);

  2、使用

  class="page-part" v-model="selected">   id="1">选项一   id="2">选项二   id="3">选项三 v-model="selected">   id="1">     v-for="n in 10" :title="'内容 ' + n" />     id="2">     v-for="n in 4" :title="'测试 ' + n" />     id="3">     v-for="n in 6" :title="'选项 ' + n" />

   

   

  问题一：没有默认点击页面

  初始化参数：selected

  data(){   return {     selected:'1'   } }

   

  问题二：没有默认点击选中的导航条

  

  检查

  

  发现，多添加了margin-bottom.去掉即可

  .is-selected   z-index 1

   

  这个时候就可以了