vue之跳转页面

一、内部跳转

方法一：

<router-link :to="{name: 'Vue组件名称', params: { entityId: this.entityId } }"> </router-link>

params :{Id: this.Id}里面是要传递过去的参数。（不常用）

 

方法二：this.$router.push()

<div class="btn" @click="toBook()" >去看书</div>

methods: {

    toBook () {

        this.$route.push({path: '/book', query: {'id', this.id}})

    }

},

或简化：

this.$router.push('模块名称')， 如 this.$router.push('homePage')

返回上一页：

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

如果不是vue-router形式，那么采用 window.history.go(-1)

 

二、跳转到外部链接

vue页面中的内部跳转用this.$router.push()实现，但是这种方法跳到外部链接，链接的路径出现拼接错误，所以要使用window.location.href = " 链接地址"

<div class="btn" @click="toWebsite()"  >返回官网</div>

  methods: {
    toWebsite () {
      window.location.href = 'https://home.xxxxx.com'
    }
  },