vue的router-link和a标签的本质区别

a标签和router-linka标签<a href="">链接 </a>router-link<router-link to=""></router-link>a标签点击a标签从当前页面跳转到另一个页面通过a标签跳转，页面就会重新加载，相当于重新打开了一个网页router-link通过router-link进行跳转不会跳转到新的页面，不会重新渲染，它

rennan…

3951人浏览 · 2020-05-25 09:08:34

rennan… · 2020-05-25 09:08:34 发布

a标签和router-link

a标签

<a href="">链接 </a>

router-link

<router-link to=""></router-link>

a标签

点击a标签从当前页面跳转到另一个页面
通过a标签跳转，页面就会重新加载，相当于重新打开了一个网页

router-link

通过router-link进行跳转不会跳转到新的页面，不会重新渲染，它会选择路由所指的组件进行渲染

总结

通过a标签和router-link对比，router-link避免了重复渲染，不像a标签一样需要重新渲染减少了DOM性能的损耗

参考博客:
https://blog.csdn.net/saber04/article/details/96717294

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