博客
关于我
vue路由6:导航钩子
阅读量:324 次
发布时间:2019-03-04

本文共 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/

你可能感兴趣的文章
php布尔值的++
查看>>
PHP常量、变量作用域详解(一)
查看>>
PHP应用目录结构设计
查看>>
PHP应用程序连接MSQL数据库Demo(附crud程序)
查看>>
PHP开发api接口安全验证
查看>>
PHP开发规范PSR
查看>>
PHP开发遇到错误0001
查看>>
PHP引入了泛型和集合两大重要特性,大大改善 PHP 代码的可维护性和可读性
查看>>
PHP引擎php.ini参数优化
查看>>
PHP引用(&)使用详解
查看>>
php引用及垃圾回收
查看>>
php当前时间的集中写法
查看>>
php循环比较数组中的值,如何从PHP数组中计算值并在foreach循环中仅显示一次值?...
查看>>
php微信 开发笔记,微信WebApp开发总结笔记
查看>>
php微信公众号开发access_token获取
查看>>
php微信公众号开发用户基本信息
查看>>
php怎么将对象变成数组,php怎么将对象转换成数组
查看>>
php怎样比较两数大小,jquery如何判断两个数值的大小
查看>>
PHP性能监控 - 开启xhprof(一)
查看>>
PHP性能监控 - 怎么看xhprof报告(二)
查看>>