0👍
✅
Youa re very close, but you need to wrap your custom property in meta option:
const routes = [
{
path: "/",
name: "Home",
component: Home,
meta: { showOnBar: true }
},
{
path: "/about",
name: "About",
meta: { showOnBar: true }
component: () => import("@/views/About.vue")
},
{
path: "/aktuelles",
name: "Aktuelles",
meta: { showOnBar: true },
component: () => import("@/views/Aktuelles.vue")
},
{
path: "/datenschutz",
name: "Datenschutz",
meta: { showOnBar: false }
component: () => import("@/views/Datenschutz.vue")
}
];
and access it via route.meta.showOnBar
. Keep in mind that you only need to define it for routes you want to show on your navbar.
0👍
You need to wrap your custom route properties into meta
as stated in BroiSatse’s answer.
However, another issue is that you used :v-if
(i.e. you bound the v-if
attribute) instead of just using v-if
. v-if
already evaluates the condition in the value as per the docs.
Here’s a sandbox to play around with: https://codesandbox.io/s/stack-overflow-q-62409392-6zovw?file=/src/router/index.js
Source:stackexchange.com