Vue二級路由配置

  • 二級路由配置path時前面不能有 ' / '
  • 在一級路徑信息數組中添加一個children配置項：
       {path:'/hot',component:Hot,
             children:[
              {path:'/',redirect:'film'},                  //配置默認顯示模板內容
              {path:'film',component:{template:'<p>妖貓傳</p>'}},
              {path:'tv',component:{template:'<p>河神</p>'}},
              {path:'music',component:{template:'<p>緣分一道橋</p>'}}
             ]
        }
  • 在一級路由的模板中添加<router-link to=''></router-link>,to中的地址需要 加上一級路由
  • 供二級路由對應模板顯示的<router-view></router-view>也不能忘！
<template id="hot">
        <div class="hotWrap">
                <h2>Hot</h2>
                <router-link to="/hot/film">film</router-link>
                <router-link to="/hot/tv">tv</router-link>
                <router-link to="/hot/music">music</router-link>
                <router-view></router-view>
        </div>
</template>
最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容