我要评论vue-router跳转和location.href区别
使用 location.href= /url 来跳转， 简单方便， 但是刷新了页面
使用 history.pushstate( /url ) ， 无刷新页面， 静态跳转；引进 router ， 然后使用 router.push( /url ) 来跳转， 使用了 diff算法， 实现了按需加载， 减少了 dom 的消耗。
注：
- 使用 router 跳转和使用 history.pushstate() 没什么差别的
- 因为 vue-router 就是用了 history.pushstate()
- 尤其是在 history 模式下
vue 路由跳转
vue router 是 vue.js 官方的路由管理器，它允许我们通过定义路由来管理应用程序的不同视图和状态。
vue 路由跳转主要有以下几种方式
1.<router-link> 标签
<router-link to="/about">go to about</router-link>
2.this.$router.push 方法
this.$router.push('/about');
// 跳转:
this.$router.push({name:'home',query: {id:'1'}})
this.$router.push({path:'/home',query: {id:'1'}})
// 获取参数html职参
$route.query.id
//script取参
this.$route.query.id3.this.$router.replace 方法
this.$router.replace 方法与 this.$router.push 类似，但它不会向 history 添加新记录，而是替换当前的 history 记录。
this.$router.replace('/about');4.this.$router.go 方法
this.$router.go 方法用于在 history 记录中前进或后退。
this.$router.go(-1); // 后退一页 this.$router.go(1); // 前进一页
location.href
相较于vue router，location.href= /url会重新加载整个页面，性能相对较低并且没有返回记录
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持代码网。
发表评论