Answer a question

While using v-breadcrumbs from vuetify, i came upon a problem.

I have a named path in vue-router to "/" route, but when I'm passing it to "to" prop in breadcrumb, it becomes disabled. Other named paths are working just fine. Does anybody have an idea what may be causing this behaviour?

The problematic path:

{
     name: 'bar',  
     path: '/',
     component: () => import('@/foo/bar.vue'),
},

The breadcrumbs items property value look something like this:

[
    {
       text: 'bar',
       disabled: false,
       to: { name: 'bar' }
    }
]

Answers

use exact: true,

like:

      {
          text: "Breadcrumb name",
          link: true,
          exact: true,
          disabled: false,
          to: {
            name: 'route name', 
            params: {
                paramName: value
            }
          }
       }