Vuetify: [Bug Report] VBreadcrumbsItem unexpectedly disabled when using nested routes

[lbssousa]

Environment

Vuetify Version: 2.0.11
Vue Version: 2.6.10
Browsers: Chrome 76.0.3809.132
OS: Linux x86_64

Steps to reproduce

Click on breadcrumb Item 1

Expected Behavior

Only breadcrumb Item 1 (child route /items/1) should be disabled

Actual Behavior

Both breadcrumbs Items (parent route /items) and Item 1 (child route /items/1) are disabled

Reproduction Link

https://codepen.io/lbssousa/pen/rNBGmgg

[lbssousa]

Possible workaround (overwrite parent route's prop activeClass):

<template>
  <VBreadcrumbs :items="breadcrumbs">
    <template #item="{ item }">
      <VBreadcrumbsItem
        :active-class="item.to !== $route.path ? '' : undefined"
        :disabled="item.disabled"
        :href="item.href"
        :link="item.link"
        :to="item.to"
      >
        {{ item.text }}
      </VBreadcrumbsItem>
    </template>
  </VBreadcrumbs>
</template>

[jacekkarczmarczyk]

https://codepen.io/jkarczm/pen/vYBeMMw

[Gompje]

@lbssousa had the same issue, your workaround worked .. but @jacekkarczmarczyk 's undocumented feature worked even better! Thx! 👍

@jacekkarczmarczyk maybe add to the docs that this component (only combined with v-router?) disables the crumb to the current page. Didn't know it did that. My crumbs weren't working but the data was correct. Thanks to @lbssousa 's issue I realised it wasn't the data at all.

[jacekkarczmarczyk]

That's why i didn't close the issue and tagged is add added the documentation label

[Gompje]

Jup, saw the label. Just thought that adding some extra feedback for the updates to the doc would come in handy maybe. And to give my support. :-)

V
On 5 Sep 2019, 22:44 +0200, Jacek Karczmarczyk [e-mail], wrote:

That's why i didn't close the issue and tagged is add added the documentation label
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.