首页技术文章正文

编程式导航:router.go()方法的使用【Web前端培训】

更新时间:2022-11-02 来源:黑马程序员 浏览量:

IT培训班

  router.go()方法的参数是一个整数,表示在history历史记录中前进或后退多少步,类似于window.history.go()。this.$router.go(-1)相当于history.back(),表示后退一步;this.$router.go(1)相当于history.forward(),表示前进一步,功能类似于浏览器上的后退和前进按钮,相应的地址栏也会发生改变。下面我们通过例5-9进行演示。

  【例5-9】

  (1)创建C:\vue\chapter05\demo09.html文件,具体代码如下:

<div id="app">
    <button @click="goBack">后退</button>
</div>
<script>
var router = new Vue({
    el: '#app',
    methods: {
        goBack () {
            this.$router.go(-1) //  使用this.$router.go()进行后退操作
        }
    },
    router
})
</script>

  (2)在浏览器中打开demo09.html,单击“后退”按钮,浏览器就会执行后退操作。

分享到:
在线咨询 我要报名
和我们在线交谈!