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

相关推荐
zpjing~.~2 分钟前
CSS 过渡动画效果
前端·css
Senar6 分钟前
机器学习和前端
前端·人工智能·机器学习
GISer_Jing8 分钟前
React基础知识(总结回顾一)
前端·react.js·前端框架
我叫czc35 分钟前
【Python高级366】静态Web服务器开发
服务器·前端·python
温轻舟41 分钟前
前端开发 -- 自动回复机器人【附完整源码】
前端·javascript·css·机器人·html·交互·温轻舟
赵大仁42 分钟前
深入解析 Vue 3 的核心原理
前端·javascript·vue.js·react.js·ecmascript
张小虎在学习1 小时前
JS 数组创建、访问、常用方法
javascript
张小虎在学习1 小时前
JS 三种添加元素的方式、区别( write、createElement、innerHTML )
javascript
csstmg1 小时前
记录一次前端绘画海报的过程及遇到的几个问题
前端
bidepanm1 小时前
Vue.use()和Vue.component()
前端·javascript·vue.js