[VueJS] Vue-cli & Vue-router

Guten Tag,

ich habe in meinem PHP Projekt angefangen mit VueJS zu arbeiten.
In diesem gewissen Projekt frage ich mit Ajax Request Daten ab und benutze diese dann in meinen Vue Components.

Nun habe ich als Einstiegspunkte eine index.html, diese beinhaltet ein Div mit der Id "app", als Element für die Vue Root instance. die Vue Root instance hat ein Template welches so aussieht:

<template>
  <div id="app">


    <div id="navigationbar">
      <navigation></navigation>
    </div>


    <div id="content">
      <content></content>
    </div>


    <div id="footer">
      <footerbart></footerbar>
    </div>


  </div>
</template>

Das funktioniert auch alles ganz gut. Nun möchte ich nicht immer den selben Content anzeigen und dementsprechend auch andere Komponenten dafür benutzen.

Dafür habe ich mir den Vue-Router installiert und möchte mit diesem jetzt anhand der URI abfragen können, was genau der User sehen soll.
Nun habe ich mir den Vue-Router angeschaut und gemerkt, dass man anhand der URI ein Template angeben kann, welches angezeigt werden soll. Das sieht dann so aus:

import content from './components/Content_component.vue';


export default [
  {path: '/', component: content}
]

Gibt es eine Möglichkeit, dass ich nur den Inhalt vom Div mit der ID "content" ersetze? Oder wie könnte ich das ansonsten sauber umsetzen?

Mit freundlichen Grüßen
Smile325