Mehrere Schritte zum Erstellen eines Routings in Vue

Mehrere Schritte zum Erstellen von Routing in Vue;
Schritt eins: Definieren Sie die Komponenten, die Routing erfordern.
Schritt 2: Routing definieren.
Schritt 3: Erstellen Sie eine Routing-Instanz und übergeben Sie die Konfiguration der definierten Route.
Schritt 4: Erstellen Sie eine Root-Instanz, um die Route bereitzustellen.
1. Definieren Sie die Routing-Komponente

const Foo : {template: &#39;<p> this is foo </p>
const Bar : {template: &#39;<p> this is bar </p>
.....

2 Definieren Sie die Route

const routes: [
{path: '/foo', component: Foo},
{path: '/bar', component: Bar}
]

3

const router = new VueRouter({
        routes: routes
})

4. Erstellen Sie eine Mount-Root-Instanz

const app = new Vue({
router： router
}).$mount('#app')

HTML

<!--外部链接--><script src="https://unpkg.com/vue/dist/vue.js"></script><script src="https://unpkg.com/vue-router/dist/vue-router.js"></script><p id="app">
  <h1>Hello</h1>
  <p>
    <router-link to="/foo">Go to Foo</router-link>
    <router-link to="/bar">Go to Bar</router-link>
  </p>
  <router-view></router-view></p>

Das obige ist der detaillierte Inhalt vonMehrere Schritte zum Erstellen eines Routings in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!