Vue路由

//s1定义组件
var login = {
            template:"<h1>登录</h1>"
        }
        var reg = {
            template:"<h1>注册</h1>"
        }
//s2.示例Router对象并配置路由
    var router = new VueRouter({
        routes:[
            {
                path:'/log',
                component:login
            },
            {
                path:'/reg',
                component:reg
            }
        ]
    })
    //s3.注册路由
        var vm = new Vue({
            el:"#app",
            data:{},
            methods:{},
            router
        })
//s4.页面显示
<div id="app">
        <router-link to="/log">登录</router-link>
        <router-link to="/reg">注册</router-link>//路由链接
        <router-view></router-view>//不同组件展示区域
    </div>

new VueRouter({
    routes:[
        {path:"/",component:},
    ],
     linkActive:"myactive"
})

<router-link to="/link/10/tzh" ></router-link>//路由传参

new VueRouter({
    routes:[
        {path:"/login/:id/:name",component:}//定义路由参数
    ]
})

//接收参数
this.$route.params.参数名

new VueRouter({
    routes:[
        {
        path:"/login/:id/:name",
        component:login
        //子路由
        children:[
            {path,component},
            {path,component}
        ]
        }
    ],
})

new VueRouter({
    routes:[
        {
        path:"/login/:id/:name",
        component:{
        default:header,//默认视图
        left:leftbox
        right:rightbox
        }
        }
    ],
    

})
<router-view ></router-view>//展示默认视图
<router-view name="left"></router-view>
<router-view name="right"></router-view>