Vue——小白也能学!Day6

路由进阶

1.路由封装

所有的路由配置在main.js中不合适,所以需要拆分封装,加入router文件夹。便于后期维护。

router-link必须配to,不能配href。

修改后在css中修改router-link-active属性

模糊匹配

定制高亮类名

需要在路由中进行配置

跳转传参

目的是在跳转路由时进行传值

1.查询参数传参(传多个参数

语法格式如下

to="/path?参数名=值"------可以用&进行连接

②对应页面组件接收传递过来的值

$route.query.参数名

2.动态路由传参(传单个较方便

参数可选符

3.重定向

redirect重新定向路径

404 not found!

4.模式设置

这里的影响只对后台有影响,需要提醒后端配置规则

5.路由跳转

基本跳转

写在methods中

①path路径跳转

this.$router.push('路由路径')

this.$router.push({

path:'路由路径'

})

②name命名路由跳转(适合path路径长的场景)

需要给路由起一个名字

总结

路径简单path复杂path

多个参数query,参数少用params

相关推荐
小雨下雨的雨2 分钟前
井字棋AI机器人实现详解 - Minimax算法实战-鸿蒙PC Electron框架完成
前端·人工智能·算法·华为·electron·鸿蒙
ZC跨境爬虫4 小时前
跟着 MDN 学JavaScript day_7:数学运算与逻辑判断实战测试
开发语言·前端·javascript·学习·ecmascript
fangdengfu1234 小时前
ES分析系统各个服务日志占用量
java·前端·elasticsearch
凌云拓界4 小时前
文件管理:让AI安全操作你的电脑 ——CogitoAgent开发实战(三)
javascript·人工智能·架构·开源·node.js
凌云拓界5 小时前
联网能力:让AI看见更广阔的世界 ——CogitoAgent开发实战(四)
javascript·人工智能·架构·node.js·创业创新
JustHappy5 小时前
古法编程秘籍(六):程序到底是怎么跑起来的?从 IO 到中断,一次讲明白
前端·后端·全栈
HYCS6 小时前
用pixi.js实现fabric.js(六):从线性代数的角度理解编辑器交互
前端·javascript·canvas
卷帘依旧6 小时前
useImperativeHandle的作用
前端
卷帘依旧6 小时前
Hooks在Fiber上的存储原理
前端