本文共 1203 字,大约阅读时间需要 4 分钟。
index.html:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <div> <router-link to="/">首页</router-link> <router-link to="/login">登录</router-link> <router-link to="/post">帖子管理</router-link> </div> <div> <router-view></router-view> </div></div><script src="../lib/vue.js"></script><script src="../lib/router.js"></script><script src="./js/app.js"></script></body></html>
app.js:
var routes = [ { path: '/', component:{ template: ` <p>这里是首页</p> ` } },{ path: '/login', component: { template: ` <p>这里是登录!</p> ` } },{ path: '/post', component: { template: ` <p>这里是帖子管理</p> ` } }];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})
转载地址:http://jgvq.baihongyu.com/