[Vuejs]-How to use dynamic text with vuetify breadcrumbs

by

0👍

The solution I found that works was to create a computed property that updates the final breadcrumb to be reactive. The code above had been edited to reflect the solution.

-1👍

Using an arrow function in data declaration you don’t have access to this, so you can’t access props.

  data(){
        items: [
          {
            text: 'Home',
            disabled: false,
            href: '/',
          },
          {
            text: 'All Products',
            disabled: false,
            href: '/products',
          },
          {
            text: this.product.title,
            disabled: true,
            href: '#',
          },
        ],
      }

Like that, it should solve your problem of this not being defined.

Take a look here to learn more about it.

Hope this helps!

Leave a comment