<template>
  <div>
    <tabbar>
      <tabbar-item>
        <img
          slot="icon"
          src="../assets/demo/icon_nav_button.png"
        >
        <span slot="label">Wechat</span>
      </tabbar-item>
      <tabbar-item show-dot>
        <img
          slot="icon"
          src="../assets/demo/icon_nav_msg.png"
        >
        <span slot="label">Message</span>
      </tabbar-item>
      <tabbar-item selected>
        <img
          slot="icon"
          src="../assets/demo/icon_nav_article.png"
        >
        <span slot="label">Explore</span>
      </tabbar-item>
      <tabbar-item>
        <img
          slot="icon"
          src="../assets/demo/icon_nav_cell.png"
        >
        <span slot="label">News</span>
      </tabbar-item>
    </tabbar>
  </div>
</template>

<script>
import { Tabbar, TabbarItem } from '../components/_index'

export default {
  components: {
    Tabbar,
    TabbarItem
  }
}
</script>
