<view class='page-container-classname' ref='saveChildRef0'>
  <demo-block title='基础用法' ref='saveChildRef1'>
    <van-tabbar active='{{ active }}' data-key='active' custom-class='tabbar-position' safe-area-inset-bottom='{{ false }}' onChange='onChange' ref='saveChildRef2'>
      <van-tabbar-item icon='home-o' ref='saveChildRef3'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='search' ref='saveChildRef4'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='friends-o' ref='saveChildRef5'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='setting-o' ref='saveChildRef6'>
        标签
      </van-tabbar-item>
    </van-tabbar>
  </demo-block>
  <demo-block title='通过名称匹配' ref='saveChildRef7'>
    <van-tabbar active='{{ active2 }}' data-key='active2' custom-class='tabbar-position' safe-area-inset-bottom='{{ false }}' onChange='onChange' ref='saveChildRef8'>
      <van-tabbar-item name='home' icon='home-o' ref='saveChildRef9'>
        标签
      </van-tabbar-item>
      <van-tabbar-item name='search' icon='search' ref='saveChildRef10'>
        标签
      </van-tabbar-item>
      <van-tabbar-item name='friends' icon='friends-o' ref='saveChildRef11'>
        标签
      </van-tabbar-item>
      <van-tabbar-item name='setting' icon='setting-o' ref='saveChildRef12'>
        标签
      </van-tabbar-item>
    </van-tabbar>
  </demo-block>
  <demo-block title='显示徽标' ref='saveChildRef13'>
    <van-tabbar active='{{ active3 }}' data-key='active3' custom-class='tabbar-position' safe-area-inset-bottom='{{ false }}' onChange='onChange' ref='saveChildRef14'>
      <van-tabbar-item icon='home-o' ref='saveChildRef15'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='search' dot=" " ref='saveChildRef16'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='friends-o' info='5' ref='saveChildRef17'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='setting-o' info='20' ref='saveChildRef18'>
        标签
      </van-tabbar-item>
    </van-tabbar>
  </demo-block>
  <demo-block title='自定义图标' ref='saveChildRef19'>
    <van-tabbar active='{{ active4 }}' data-key='active4' custom-class='tabbar-position' safe-area-inset-bottom='{{ false }}' onChange='onChange' ref='saveChildRef20'>
      <van-tabbar-item info='3' ref='saveChildRef21'>
        <image slot='icon' src='{{ icon.normal }}' mode='aspectFit' style='width: 30px; height: 18px;'>
        </image>
        <image slot='icon-active' src='{{ icon.active }}' mode='aspectFit' style='width: 30px; height: 18px;'>
        </image>
        自定义
      </van-tabbar-item>
      <van-tabbar-item icon='search' ref='saveChildRef22'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='setting-o' ref='saveChildRef23'>
        标签
      </van-tabbar-item>
    </van-tabbar>
  </demo-block>
  <demo-block title='自定义颜色' ref='saveChildRef24'>
    <van-tabbar active='{{ active5 }}' data-key='active5' custom-class='tabbar-position' active-color='#07c160' inactive-color='#000' safe-area-inset-bottom='{{ false }}' onChange='onChange' ref='saveChildRef25'>
      <van-tabbar-item icon='home-o' ref='saveChildRef26'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='search' ref='saveChildRef27'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='friends-o' ref='saveChildRef28'>
        标签
      </van-tabbar-item>
      <van-tabbar-item icon='setting-o' ref='saveChildRef29'>
        标签
      </van-tabbar-item>
    </van-tabbar>
  </demo-block>
  <demo-block title='切换标签事件' ref='saveChildRef30'>
    <van-tabbar active='{{ active6 }}' data-key='active6' custom-class='tabbar-position' safe-area-inset-bottom='{{ false }}' onChange='handleChange' ref='saveChildRef31'>
      <van-tabbar-item icon='home-o' ref='saveChildRef32'>
        标签1
      </van-tabbar-item>
      <van-tabbar-item icon='search' ref='saveChildRef33'>
        标签2
      </van-tabbar-item>
      <van-tabbar-item icon='friends-o' ref='saveChildRef34'>
        标签3
      </van-tabbar-item>
      <van-tabbar-item icon='setting-o' ref='saveChildRef35'>
        标签4
      </van-tabbar-item>
    </van-tabbar>
  </demo-block>
</view>