vue通过代码进行路由的跳转
程序员文章站
2022-03-04 10:46:02
...
vue-router 中并不一定要通过router-link才能实现路径的跳转
可以自定义元素节点,给元素节点添加点击事件和方法,在方法里面通过适当的方式,来改变vue当前的路由,从而实现vue路由的单页面响应
<button @click="home">home</button>
<button @click="about">about</button>
通过处理点击事件,利用this.$router.replace()方法,来改变当前的路由
var vm = new Vue({
el:'root',
methods:{
home:function(){
this.$router.replace('/home')
//this.$router.push('/home')
},
about:function(){
this.$router.replace('/about')
//this.$router.push('/about')
}
}
})
推荐阅读
-
Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决
-
jQuery对底部导航进行跳转并高亮显示的实例代码
-
vue2.0项目实现路由跳转的方法详解
-
vue根据进入的路由进行原路返回的方法
-
vue如何通过id从列表页跳转到对应的详情页
-
前端工程师通过nodejs链接linux,并上传代码进行半自动化更新,省去ssh+ftp的链接工具-前端黑科技-SegmentFault思否
-
使用vue-route 的 beforeEach 实现导航守卫(路由跳转前验证登录)功能
-
vue+Vue Router多级侧导航切换路由(页面)的实现代码
-
使用Vue.observable()进行状态管理的实例代码详解
-
vue-router 实现导航守卫(路由卫士)的实例代码