2017-01-06 13 views
1

子供のルート(上記の例ではhttp://<mydomain>/applis)をナビゲートしてからページを更新すると何が起きているのか把握できません=>見つからないVue 2/VueRouter:子供のルート上のページを更新できません

要求されたURL /アプリは、このサーバー上に見つかりませんでした//

import MyComponentView from './components/MyComponent.vue' 
import LoginView from './components/Login.vue' 
import NotFoundView from './components/404.vue' 
import DashboardView from './components/subcomp1/Dashboard.vue' 
import ApplisView from './components/subcomp1/Applis.vue' 

const routes = [ 
    { 
    path: '/login', 
    component: LoginView 
    }, { 
    path: '/', 
    component: MyComponentView, 
    children: [ 
     { 
     path: '', 
     component: DashboardView, 
     name: 'Dashboard', 
     description: 'Overview of environment' 
     }, { 
     path: '/applis', 
     component: ApplisView, 
     name: 'Applis', 
     description: 'Applications list' 
     } 
    ] 
    }, { 
    path: '/*', 
    component: NotFoundView 
    } 
] 
export default routes 

は、私が子供のルートの基本概念を理解していませんでしたことができますか?

答えて

0

親ルートが/の場合は、すでに/loginのルートがありますが、間違っているようです。これは子どもも/です。 documentationはこう言っています:

で始まるネストされたパスはルートパスとして扱われます。これにより、ネストされたURLを使用せずにコンポーネントネストを活用できます。

ネストされたルートを持つ方法については、例hereをご覧ください。このリンクのサンプルコード:

const router = new VueRouter({ 
    routes: [ 
    { path: '/user/:id', component: User, 
     children: [ 
     // UserHome will be rendered inside User's <router-view> 
     // when /user/:id is matched 
     { path: '', component: UserHome }, 

     // UserProfile will be rendered inside User's <router-view> 
     // when /user/:id/profile is matched 
     { path: 'profile', component: UserProfile }, 

     // UserPosts will be rendered inside User's <router-view> 
     // when /user/:id/posts is matched 
     { path: 'posts', component: UserPosts } 
     ] 
    } 
    ] 
}) 

変更を加えてフィーリングを作成できる場合は、正確な修正を行うために役立ちます。

関連する問題