随笔分类 - vue2.0路由一些事情
路由知识
发表于 2018-06-18 19:44阅读:122288评论:1推荐:13
摘要:一样的和前面路由钩子类似的步骤 首先在demo下面的components下面新建一个test.vue组件 test组件代码 <template> <div class="test_box"> <p @click="go">测试组件内部守卫的作用,点击跳到HelloWorld</p> </div> <
阅读全文 »
发表于 2018-06-18 18:39阅读:9770评论:1推荐:1
摘要:首先构建一个测试demo如下图: 接着来探讨路由配置界面 可以见到控制台 当点击事件发生后(也就是第一个页面向第二个页面跳转后) 由此看出从第一个页面点击跳转后触发了两次前置钩子函数并且点击后校验是否需要登入直接进入login页面可用于后台管理权限控制页面是否需要登入权限,一次后置钩子函数;可以清楚
阅读全文 »
发表于 2018-03-28 17:18阅读:2593评论:0推荐:0
摘要:1.当 对应的路由匹配成功,将自动设置 class 属性值 .router-link-active. 模板中可以用{{$route.params.xxx取到路由参数}}或者{{$route.query取到参数}}或者{{$route.hash取到hash}} 实例中(js)可用:this.$route.params.xxx/this.$route.query.xxx取到路由参数; 2.通过$r...
阅读全文 »
发表于 2017-10-05 00:04阅读:562评论:0推荐:0
摘要:声明式 <router-link :to="...">编程式router.push(...) router.push('home') // 字符串 router.push({ path: 'home' }) // 对象 router.push({ name: 'user', params: { us
阅读全文 »
发表于 2017-09-27 23:16阅读:278评论:0推荐:0
摘要:如果组件通过query来传递num参数为1,相当与在 url 地址后面拼接参数 这是子路由中通过 this.$route.query.num 来显示传递过来的参数URL显示(http://localhost:8080/#/home/chee?num=1)
阅读全文 »
发表于 2017-09-08 22:38阅读:2274评论:0推荐:0
摘要:路由的过渡动画:让路由有过渡动画,需要在<router-view>标签的外部添加<transition>标签,标签还需要一个name属性。 css过渡类名:组件过渡过程中,会有四个CSS类名进行切换,这四个类名与transition的name属性有关,比如name=”fade”,会有如下四个CSS类
阅读全文 »
发表于 2017-09-08 22:15阅读:671评论:0推荐:0
摘要:vue-router是一个插件包,所以我们还是需要用npm/cnpm来进行安装的:npm/cnpm install vue-router --save-dev。 在路由的核心文件:src/router/index.js分析: router-link制作导航:导航链接,我们只要点击就可以实现页面内容的
阅读全文 »
发表于 2017-09-08 20:14阅读:330评论:0推荐:0
摘要:QQ登录 微信登录
阅读全文 »
发表于 2017-09-08 20:11阅读:768评论:0推荐:0
摘要:默认会被渲染成一个标签--> Home About ...
阅读全文 »
发表于 2017-08-17 15:18阅读:2518评论:0推荐:0
摘要:想要导航到不同的 URL,则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录,所以,当用户点击浏览器后退按钮时,则回到之前的 URL。 声明式 编程式<router-link :to="..."> router.push(...) // 字符串router.pus
阅读全文 »