VUE-ルータは、だから私はこのようなルートを持っているネストされたルート

Question

にテンプレートが表示されません

<template> 
    <div id="home"> 
     <router-view></router-view> 
    </div> 
</template> 

をしかし、ときに私/health/overviewと/health/bloodルートに移動すると、コンポーネントに対応するテンプレートはレンダリングされません。私はアプリ$routeのオブジェクトをチェックし、ルートとコンポーネントを正しく検出します。テンプレートだけはレンダリングされません。私がApp.vueに<router-view>を持っていれば助かります。

複数のネストされたルートを持つことはできませんか？または私は何かを逃していますか？

Answer 1

健康ルートは次のようにする必要があります：あなたが何らかの理由ですべてでHealthのコンポーネントを必要としない場合（つまり、あなたはそれぞれの子間で任意の共有機能やテンプレートを持っていない）

{ 
    path: 'health',  // not '/health' 
    component: Health, // this can just be a dummy component with a <router-view/> 
    children: [...], 
}, 

、健康ルートを完全に削除し、代わりにこれに置き換えることができます：

{ 
    path: 'health/overview', 
    component: Overview, 
}, 
{ 
    path: 'health/blood', 
    component: Blood, 
},