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文件

相关推荐
程序员黑豆4 小时前
鸿蒙应用开发:V1与V2版本数据持久化实战教程
前端·harmonyos
小月土星7 小时前
React Router 前端路由深度解析:从传统后端路由到现代 SPA 的完整演进
前端
程序员黑豆7 小时前
鸿蒙开发 Navigation 路由教程:从入门到实战
前端·harmonyos
烬羽9 小时前
React Router v7 完全指南:一个 Demo 吃透前端路由
javascript·react.js·前端框架
烬羽10 小时前
从"整个页面刷新"到"丝滑切换":手写一个 HashRouter 彻底搞懂前端路由
javascript·前端框架·全栈
用户9385156350710 小时前
从零理解 React Router v6:每一个 API 都是怎么工作的
前端·javascript·全栈
用户0595401744612 小时前
Redis缓存回滚踩坑实录:一个配置失误,让我在凌晨3点丢了3000条数据
前端·css
kyriewen13 小时前
别再这样写条件渲染了——你的React组件里藏着这5种定时炸弹
前端·javascript·react.js
IT_陈寒13 小时前
Redis缓存击穿把我坑惨了,原来这样设过期时间才靠谱
前端·人工智能·后端
用户9385156350713 小时前
从"坐电梯"到"前端路由"——深入理解 Hash 路由原理
前端·typescript·全栈