![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue Router
youyouwuxin1234
博主:忧忧吾心
学历:2017.09-2019.07 硕士 - 武汉大学 软件工程
2013.08-2017.06 本科 - 郑州大学 计算机科学与技术
工作:2019.07.02-2021.11.16,在美的集团IT部门国际事业部,任职软件开发工程师
2021.11.22-2021.12.31,在新华三大数据有限公司从事软件研发
2022.01.01-至今,在紫光集团旗下紫光云技术有限公司从事中间件软件研发工作
其他:代表公司参加过2019年杭州阿里巴巴云栖大会
兴趣:爱生活、爱学习、爱运动、爱旅行、爱美食。
展开
-
355、Vue Router学习笔记09 -【滚动行为、路由懒加载】 2020.05.06
0、目录1、滚动行为1.1 异步滚动2、路由懒加载2.1 把组件按组分块3、参考文献1、滚动行为使用前端路由,当切换到新路由时,想要页面滚到顶部,或者是保持原先的滚动位置,就像重新加载页面那样。 vue-router 能做到,而且更好,它让你可以自定义路由切换时页面如何滚动。注意: 这个功能只在支持 history.pushState 的浏览器中可用。当创建一个 Router 实例,你可以...原创 2020-05-06 11:38:02 · 142 阅读 · 0 评论 -
354、Vue Router学习笔记08 -【过渡动效、数据获取】 2020.05.06
0、目录1、2、3、1、2、3、原创 2020-05-06 11:17:13 · 161 阅读 · 0 评论 -
353、Vue Router学习笔记07 -【导航守卫、路由元信息】 2020.04.28
0、目录1、导航守卫1.1 全局前置守卫1.2 全局解析守卫1.3 全局后置钩子1.4 路由独享的守卫1.5、组件内的守卫1.6 完整的导航解析流程2、路由元信息3、参考文献“导航”表示路由正在发生改变。1、导航守卫正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的。记住参数...原创 2020-04-28 16:10:58 · 142 阅读 · 0 评论 -
352、Vue Router学习笔记06 -【HTML5 History 模式】 2020.04.28
0、目录1、HTML5 History 模式2、后端配置例子2.1 Apache2.2 nginx2.3 原生 Node.js3、参考文献1、HTML5 History 模式vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。如果不想要很丑的 hash,我们可以用路由的 history 模式,这种...原创 2020-04-28 15:33:13 · 275 阅读 · 0 评论 -
351、Vue Router学习笔记05 -【路由组件传参】 2020.04.28
0、目录1、路由组件传参2、布尔模式3、对象模式4、函数模式5、参考文献1、路由组件传参在组件中使用 $route 会使之与其对应路由形成高度耦合,从而使组件只能在某些特定的 URL 上使用,限制了其灵活性。使用 props 将组件和路由解耦:取代与 $route 的耦合const User = { template: '<div>User {{ $route.param...原创 2020-04-28 15:15:28 · 438 阅读 · 0 评论 -
347、Vue Router学习笔记01 -【安装、介绍、起步】 2020.04.27
0、目录1、安装1.1 直接下载 / CDN1.2 NPM1.3 构建开发版2、介绍3、起步3.1 HTML3.2 JavaScript4、参考文献1、安装1.1 直接下载 / CDNhttps://unpkg.com/vue-router/dist/vue-router.jsUnpkg.com 提供了基于 NPM 的 CDN 链接。上面的链接会一直指向在 NPM 发布的最新版本。...原创 2020-04-27 17:42:49 · 144 阅读 · 0 评论 -
350、Vue Router学习笔记04 -【命名视图 、重定向和别名】 2020.04.28
0、目录1、命名视图2、嵌套命名视图3、重定向和别名3.1 重定向3.2 别名4、参考文献1、命名视图有时候想同时 (同级) 展示多个视图,而不是嵌套展示,例如创建一个布局,有 sidebar (侧导航) 和 main (主内容) 两个视图,这个时候命名视图就派上用场了。你可以在界面中拥有多个单独命名的视图,而不是只有一个单独的出口。如果 router-view 没有设置名字,那么默认为 d...原创 2020-04-28 14:38:38 · 114 阅读 · 0 评论 -
349、Vue Router学习笔记03 -【编程式的导航、命名路由】 2020.04.28
0、目录1、编程式的导航1.1 router.push(location, onComplete?, onAbort?)1.2 router.replace(location, onComplete?, onAbort?)1.3 router.go(n)1.4 操作 History2、命名路由3、参考文献1、编程式的导航除了使用 <router-link 创建 a 标签来定义导...原创 2020-04-28 13:51:55 · 312 阅读 · 0 评论 -
348、Vue Router学习笔记02 -【动态路由匹配、嵌套路由】 2020.04.27
0、目录1、动态路由匹配1.1 响应路由参数的变化1.2 捕获所有路由或 404 Not found 路由1.3 匹配优先级2、嵌套路由3、参考文献1、动态路由匹配我们经常需要把某种模式匹配到的所有路由,全都映射到同个组件。例如,我们有一个 User 组件,对于所有 ID 各不相同的用户,都要使用这个组件来渲染。那么,我们可以在 vue-router 的路由路径中使用“动态路径参数”(d...原创 2020-04-27 18:27:57 · 301 阅读 · 0 评论