Vue基础知识:路由的封装抽离,路由模块的封装抽离的好处是什么?,如何快速的引入组件,基于@指代src目录,从src目录出发找组件

如果将所有的路由配置都存放在main.js中,是非常有问题的,杂且乱。所以我们要将路由模块进行抽离,这样有利于:拆分模块,利于维护。大致的做法就是将路由相关的东西放到router这个文件夹的index.js中,而将来只需要将index.js导入到main.js中渲染就可以了。

具体步骤演示:

1.在src文件夹中创建router文件夹

2.在router中创建index.js

3.复制粘贴main.js中关于路由相关的代码到router中index.js中

(其中有三个注意点,要导入vue和导出router这个对象,并且路径不要搞错)

快速引入组件:

基于@指代src目录,从src目录出发找组件

4.在main.js中导入router中的index.js文件

相关推荐
心之语歌7 分钟前
flutter 父子组件互相调用方法,值更新
前端·javascript·flutter
带你看月亮29 分钟前
Vue3解析学习 - handlers 模块
vue.js·学习
岱宗夫up29 分钟前
FastAPI进阶3:云原生架构与DevOps最佳实践
前端·python·云原生·架构·前端框架·fastapi·devops
赛博切图仔31 分钟前
告别“打字机”:Generative UI 如何重塑 AI 时代的前端交互?
前端·人工智能·ui
wangbing112533 分钟前
开发指南141-类和字节数组转换
java·服务器·前端
~央千澈~33 分钟前
抖音弹幕游戏开发之第15集:添加配置文件·优雅草云桧·卓伊凡
java·前端·python
wsad053236 分钟前
Shell 脚本中的多行注释和 Here Document 语法解析
前端·chrome
肖。354878709442 分钟前
html中onclick误区,后续变量会更改怎么办?
android·java·javascript·css·html
暴力袋鼠哥1 小时前
SpringBoot+Vue实战:多模态疾病初筛与护理建议系统(含泳道图+时序图+完整后端代码)
vue.js·spring boot·后端
Lee川1 小时前
从字符串操作到数组映射:一次JavaScript数据处理的深度探索
javascript