Как передать this.$route в header компонент vue?

У меня есть такой index.blade.php

<div id="app">             
<header-component></header-component>
<navbar-component></navbar-component>
<router-view></router-view>
<footer-component></footer-component>
</div>

Мне нужно получить текущий маршрут this.$route в navbar-component. В router-view у меня отображаются страницы по заданным маршрутам

const routes=[
    {
        path:"/",
        name: 'Home',
        component: () => import('./views/index.vue')
    },
    {
        path:"/about",
        name: 'About',
        component: () => import('./views/about.vue')
    },
....

header,navbar, footer у меня объявлены в app.js

Vue.component('header-component', require('./components/Header.vue').default);
Vue.component('navbar-component', require('./components/Categorybar.vue').default);
Vue.component('footer-component', require('./components/Footer.vue').default);

Из-за этого, как я понимаю, я не могу получить текущий параметр маршрута в них, т.к. они возвращают значения стартовой страницы.

Скажите, пожалуйста, как правильно в данном случае подключить данные компоненты, чтобы они имели доступ к this.$route? Вообще я пытаюсь это сделать, чтобы по текущему маршруту не отображать компонент categorybar