问在循环中包含Vuetify <v-badge />？

EN

  <template>
    <v-tabs
      class="hidden-sm-and-down"
      optional>

      <v-tab
        v-for="(item, i) in items"
        :key="i"
        :exact="item.title === 'Home'"
        :to="item.to"
        nuxt
        :ripple="false"
        active-class="text--primary"
        class="font-weight-bold nav-link"
        min-width="96"
        text>

        <v-badge                 <-- tried setting v-if/else here
          v-if="item.badge"
          color="red"
          :content="cartItems"
          :value="cartItems"
          overlap>
          {{ item.title }}
        </v-badge>

        <span v-else>{{ item.title }}</span>

      </v-tab>
    </v-tabs>
  </template>

  <script>
    export default {
      data: () => ({
        items: [
          {title: 'Portfolio', to: '/portfolio', badge: false},
          {title: 'About', to: '/about', badge: false},
          {title: 'Contact', to: '/contact', badge: false},
          {title: 'Cart', to: '/cart', badge: true}
        ]
      }),

      computed: {
        cartItems() {
          return 2;
        }        
      }
    }
  </script>