简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - Warum kann der Vue-Router keinen Sprung erreichen?
phpcn_u1582
phpcn_u1582 2017-07-05 10:58:58
0
3
795

Ich habe versucht, im Projekt vue-router gemäß dem Beispiel im Dokument zu verwenden. Der Pfad zum Aufrufen der Homepage lautet test.administer/index. Sollte jedoch gemäß der Routing-Konfiguration nicht zum Inhalt des Logins springen .vue-Komponente nach dem Aufrufen der Homepage? Gemäß der folgenden Konfiguration wird nach dem Aufrufen der Homepage der Inhalt in App.vue angezeigt. .

index.blade.php:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>1</title>
    <!--styles-->
    <link rel="stylesheet" href="{{ asset('css/app.css') }}">
</head>
<body>
    <p id="app"></p>
    <!--scripts-->
    <script src="{{ asset('js/main.js') }}"></script>
</body>
</html>

main.js:

import Vue from 'vue'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
Vue.use(VueRouter)
Vue.use(ElementUI)
Vue.use(VueResource)

import App from './App.vue'
import Home from'./components/Home.vue'
import Login from'./components/Login.vue'

const router = new VueRouter({
    routes:[
        { path: '/index', component: Login,
            children: [
                { path: 'homepage', component: Home}
            ]
        }
    ]
})
new Vue(Vue.util.extend({ router },App)).$mount('#app')

App.vue:

<template>
    <p id="app">
        <h1>hello world</h1>
        <router-view></router-view>
    </p>
</template>

login.vue:

<template>
    <p>loginpage</p>
</template>
phpcn_u1582
phpcn_u1582

Antworte allen(3)
迷茫
迷茫2017-07-05 11:00:58 3 Etage

你哪里有配置是 首页是 Login component 组件嘛

默认需要 /

routes:[
        { path: '/', component: Login,
            children: [
                { path: 'homepage', component: Home}
            ]
        }
    ]

如果你配置成 /index

那么对应网址是

test.administer/index/#/index

test.administer/index/#/index/homepage

另外 app.vue 里面的 hello world 会始终显示的

Wie +0
Antwort hinzufügen
过去多啦不再A梦
过去多啦不再A梦2017-07-05 11:00:58 2 Etage

没有看到你的login路由在哪里，路由的话<router-view></router-view>间的视图会跳，但外面的内容还是保留的。

Wie +0
Antwort hinzufügen
習慣沉默
習慣沉默2017-07-05 11:00:58 1 Etage 
{ path: 'homepage', component: Home}
应该是
{ path: '/homepage', component: Home}
Wie +0
Antwort hinzufügen
Beliebte Themen
Mehr>
Populäre Artikel
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！