5👍
✅
data()
is declared here as an arrow function, so this
refers to the outer scope, not the Vue component instance, but even as a regular function here, this.homeMenu
won’t yet exist.
It seems that you actually want breadcrumbs
to be reactive to homeMenu
, so you should move breadcrumbs
to a computed prop:
export default {
data: () => ({
homeMenu: '',
}),
computed: {
breadcrumbs() {
return [
{
text: 'Accueil',
disabled: false,
href: '/',
},
{
text: this.homeMenu,
disabled: false,
href: '/' + this.homeMenu,
},
]
}
}
}
0👍
I used Element Plus UI and my mind was blown. Check out my blog and the codes. Element Plus is a free library that is great for Vue JS. They have very nice UI for breadcrumb and can be implemented with v-for loop.
https://medium.com/@samchowdhury/create-a-breadcrumb-with-vue-js-and-element-plus-ui-f3e2fde50a3e
Source:stackexchange.com