网站系统与网站源码的关系,emlog轻松转wordpress,动漫设计与制作专业就业前景,建设额度哪里看一、情景说明
在前面#xff0c;我们学习了通过router-link标签#xff0c;实现路由页面跳转 但是#xff0c;它有局限性 就是router-link最终会被替换成a标签
如果#xff0c;我们的跳转按钮是button实现的了#xff1f; 该如何实现路由页面跳转了#xff1f;…一、情景说明
在前面我们学习了通过router-link标签实现路由页面跳转 但是它有局限性 就是router-link最终会被替换成a标签
如果我们的跳转按钮是button实现的了 该如何实现路由页面跳转了 这里就需要用到编程式路由跳转技术
二、案例
vc组件的跳转按钮
button clickpushShow(m)push查看/button
button clickreplaceShow(m)replace查看/buttonpush式路由跳转 在vc实例的methods中添加方法 pushShow(m){this.$router.push({name:xiangqing,query:{id:m.id,title:m.title}})},replace式路由跳转 在vc实例的methods中添加方法 replaceShow(m){this.$router.replace({name:xiangqing,query:{id:m.id,title:m.title}})}三、补充
通过代码实现浏览器的前进、后退功能 vc组件中按钮 button clickback后退/buttonbutton clickforward前进/buttonbutton clicktest测试一下go/button对应的methods方法 methods: {back(){//后退1步this.$router.back()// console.log(this.$router)},forward(){//前进1步this.$router.forward()},test(){//前进3步// this.$router.go(3)//后退3步this.$router.go(-3)}},
