vue路由6：导航钩子

index.html:

    
    



    

        首页
        登录
        帖子管理
    

    

        
    

app.js:

var routes = [
    {
        path: '/',
        component:{
            template: `
            
这里是首页
        `
        }
    },{
        path: '/login',
        component: {
            template: `
            
这里是登录!
        `
        }
    },{
        path: '/post',
        component: {
            template: `
            
这里是帖子管理
        `
        }
    }
];

var router = new VueRouter({
    routes: routes,
});

router.beforeEach(function(to, from, next){
    var login_in = true;
    if(!login_in && to.path == '/post'){
        next('/login')
    }else{
        next();
    }
})

router.afterEach(function(to, from){
    console.log("to", to);
    console.log("form", from);
});

var app = new Vue({
    el: '#app',
    router: router
})