vue页面跳转的三种方式

前言页面跳转应该是每个项目都会遇到的，而传统的页面跳转一般是使用a标签来实现，那vue的页面跳转有什么方式呢？vue页面跳转的方式a标签跳转vue的a标签跳转与传统的a标签跳转有一点区别，就是属性href的值，需要加上#，如 href="#/article/all"，如果没有#，则会跳转到首页router-link跳转使用router-link标签跳转，如方法跳转给...

Fandy_meng

3567人浏览 · 2020-04-24 10:20:13

Fandy_meng · 2020-04-24 10:20:13 发布

前言

页面跳转应该是每个项目都会遇到的，而传统的页面跳转一般是使用a标签来实现，那vue的页面跳转有什么方式呢？

vue页面跳转的方式

a标签跳转

vue的a标签跳转与传统的a标签跳转有一点区别，就是属性href的值，需要加上#，如 href="#/article/all"，如果没有#，则会跳转到首页
router-link跳转
使用router-link标签跳转，如
方法跳转
给标签加个点击事件，在事件方法内进行跳转。如

区别

前两种方式表面看起来没有区别，但是使用router-link标签跳转性能更好，而第三种方式，是最不好用的，并且在样式上，当鼠标移到跳转的连接时，鼠标图标不会变成小手形状，让人感觉不到这是一个跳转连接

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}$/, //不连续的两位字母// /^