vue之路由嵌套,子路由
阿新 • • 發佈：2019-01-15
scrip 用戶註冊 r.js itl ren 註冊 div routes let
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="js/vue.js"></script> <script src="js/vue-router.js"></script> <title>Title</title> </head> <body> <div id="app"> <router-link to="/home">主頁</router-link> <router-link to="/user">用戶</router-link> <router-view></router-view> </div> <template id="user"> <div> <h1>用戶信息</h1> <ul> <li><router-link to="/user/regist">用戶註冊</router-link></li> <li><router-link to="/user/login">用戶登錄</router-link></li> </ul> <router-view></router-view> </div> </template> </body> <script> var home={ template:'<h1>home</h1>' }; var user={ template:'#user' }; let login={ template:'<h1>登錄中....</h1>' }; let regist={ template:"<h1>註冊</h1>" } const routes1=[ {path:'/home',component:home}, {path:'/user',component:user, children:[ { path: 'login', component: login, }, { path:'regist', component:regist } ]}, // {path:'*',redirect:'/home'} ]; const router = new VueRouter({ routes:routes1, }); new Vue({ el:'#app', router }) </script> </html>
vue之路由嵌套,子路由