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

相关推荐
wearegogog1232 小时前
基于 MATLAB 的卡尔曼滤波器实现,用于消除噪声并估算信号
前端·算法·matlab
Drawing stars2 小时前
JAVA后端 前端 大模型应用 学习路线
java·前端·学习
品克缤2 小时前
Element UI MessageBox 增加第三个按钮(DOM Hack 方案)
前端·javascript·vue.js
小二·2 小时前
Python Web 开发进阶实战:性能压测与调优 —— Locust + Prometheus + Grafana 构建高并发可观测系统
前端·python·prometheus
小沐°2 小时前
vue-设置不同环境的打包和运行
前端·javascript·vue.js
Irene19913 小时前
Vue3 <Suspense> 使用指南与注意事项
vue.js·suspense
qq_419854053 小时前
CSS动效
前端·javascript·css
烛阴3 小时前
3D字体TextGeometry
前端·webgl·three.js
桜吹雪3 小时前
markstream-vue实战踩坑笔记
前端
南村群童欺我老无力.4 小时前
Flutter应用鸿蒙迁移实战:性能优化与渐进式迁移指南
javascript·flutter·ci/cd·华为·性能优化·typescript·harmonyos