javascript - Pourquoi Vue-Router ne parvient-il pas à sauter?
phpcn_u1582
phpcn_u1582 2017-07-05 10:58:58
0
3
839

J'ai essayé d'utiliser vue-router dans le projet selon l'exemple du document. Le chemin pour accéder à la page d'accueil est test.administer/index Cependant, selon la configuration du routage, ne devrait-il pas accéder au contenu de la connexion. Composant .vue après être entré sur la page d'accueil ? Selon la configuration suivante, après avoir accédé à la page d'accueil, le contenu d'App.vue est affiché. .

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

répondre à tous(3)
迷茫

Où avez-vous la configuration ? La page d'accueil est le composant de connexion


Obligatoire par défaut /

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

Si vous le configurez comme /index

Alors l'URL correspondante est

test.administer/index/#/index

test.administer/index/#/index/homepage


De plus, hello world dans app.vue sera toujours affiché


过去多啦不再A梦

Je ne vois pas où se trouve votre itinéraire de connexion. Si vous l'acheminez, les vues entre <router-view></router-view> sauteront, mais le contenu extérieur sera toujours conservé.

習慣沉默
{ path: 'homepage', component: Home}
应该是
{ path: '/homepage', component: Home}
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal