Кароч
На самом деле все проще чем тут пытаются навязать

Все функции делайте в methods().

Когда первый раз загружаете компонент, то вместо всей функции вызывайте соответствующий метод, например this.startComponent()

Затем создаете watch

Этот watch будет выглядеть как то так:

watch: {
  '$route'(){
      this.startComponent()
  }
}

И тогда все заработает как вы хотите

Про watch с route можете прочитать тут

Вы все делаете не так :)

Советую Вам изучить Vue cli

Чтобы добавить компонент в компонент, необходимо использовать , а в роутах уже прописывать сами компоненты
Либо чтобы вставить отдельно компонент в компонент, нужно в родительском компоненте прописать что то типа:

import myHeader from './header.vue'
<script>
export default {
    components: {myHeader} // и вызывать этот компонент уже как <my-header></my-header>
}
</script>

-----

В вашем случае родительский компонент должен иметь следующий вид:

<template>
    <div class="page">
        <page-header></page-header>   // <-не забудь изменить
    </div>
</template>

<script>
import PageHeader from './header.vue'
export default {
  name: 'page',
  components: { PageHeader  }
}
</script>

Скорее всего проблема не во Vue, а в webpack'e
ссылка1 ссылка2