(十一)利用指令控制路由

本节知识点

  • 利用指令来做到页面跳转

this.$router.go(-1) 和this.$router.go(1)

  • 首先我们先在app.vue里面增加一个按钮,绑定一个事件
<button @click="add"></button>
  • 然后在app.vue里面 写入add方法
<script>
export default {
  name:"app",
data(){
  return {
     message:"Hello"
   }
},
methods:{
   add:function(){
    this.$router.go(-1)
               }
}
}
</script>

备注this.$router.go(-1)就是后退到上一个 this.$router.go(1)就是前进

this.$router.push('/xxx') 跳转到指定的页面

  • 先写一个按钮实现跳转
<button @click="gowhere"></button>
  • 然后在script里面写代码
<script>
export default {
  name:"app",
data(){
  return {
     message:"Hello"
   }
},
methods:{
   gowhere:function(){
    this.$router.push("/xxx")
               }
}
}
</script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容