vue使用路由配置步骤

在现有vue项目中添加路由配置步骤如下：1.安装vue-router:npm install vue-router --save安装完成后可以在package.json->dependencies中看到版本号2.在src文件夹下创建router文件夹,再创建index.js文件以及创建路由组件3.在index.js中引入组件4.在index.js配置映射关系5.创建路由对象6.导出路由上述步

DifferentWorldforMe

6433人浏览 · 2022-04-14 14:59:01

DifferentWorldforMe · 2022-04-14 14:59:01 发布

在现有vue项目中添加路由配置步骤如下：
1.安装vue-router:npm install vue-router --save
安装完成后可以在package.json->dependencies中看到版本号
在这里插入图片描述
2.在src文件夹下创建router文件夹,再创建index.js文件以及创建路由组件

3.在index.js中引入组件

4.在index.js配置映射关系
在这里插入图片描述
5.创建路由对象

6.导出路由

上述步骤在index.js文件中完成。
路由配置完毕，使用步骤如下：
1.在项目导入路由

2.在App.vue文件中，配置相应跳转过程（根据需要在不同文件配置）

配置完毕，npm run build ->npm run serve即可使用

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^