Vue路由

Vue路由的使用

1.引入相应的js文件

    <script type="text/javascript" src="vue-router.js"></script>

2.注册想要通过路由跳转的模板

let login = {
            template: "#login"
        };
        let register ={
            template: "#register"
        };

3.定义一个路由组件

const router = new VueRouter({
            routes:[
                {path:"/login",component:login},
                {path: "/register",component: register}
            ]
        });

4.将路由组件注册到Vue对象中

var app = new Vue({
            el: "#app",
            data:{

            },methods: {

            },router:router //3.将路由组件注册进vue对象中
        })

5.在html中显示路由管理的组件

        <router-view></router-view>

6.添加切换模板使用的链接

 <a href="#/login">点击登录</a>
 <a href="#/register">点击注册</a>