zoukankan      html  css  js  c++  java
  • router-link 返回上页 和 新窗口打开链接

     

     

    1、如果使用了Vue-router的话,就可以用

    this.$router.go(-1)

    实现返回;

    2、如果没使用vue-router,就可以用

    window.history.go(-1)

    实现返回效果。

    可以 定义方法 @click="goback"

    methods:{ 
          goback(){
              this.$router.go(-1);//返回上一页
          } 
    }

    也可直接简写:

    @click="$router.back(-1)"

    跳转链接到新页面:

    template中,直接给它加上target='_blank'属性即可,反正最终它也会被解释为一个 a标签
    <router-link :to="{path: '/footer'}"  target="_blank"  tag="a">
    footer
    </router-link>

     "tag" 属 性 :具有 tag 属性的 router-link 会被渲染成相应的标签


    编程式:

    我们常用的是 $router.push 和 $router.go 但是 vue2.0以后,这种方式就不支持新窗口打开的属性了,
    这个时候就需要使用this.$router.resolve,如下:
    复制代码
    goNewPage(){
         let routeUrl = this.$router.resolve({
              path: "/newPage",
              query: {name:' 小明'}
         })
         window.open(routeUrl .href, '_blank')
    }
    复制代码
  • 相关阅读:
    矩阵快速幂
    快速排序
    用闭包来实现命令模式
    闭包和面向对象设计
    闭包及其作用
    阿里笔试
    如何在节点上添加样式
    getComputedStyle与currentStyle获取样式(style/class)
    今日头条笔试
    牛客网JavaScript编程规范
  • 原文地址:https://www.cnblogs.com/tzwbk/p/12462661.html
Copyright © 2011-2022 走看看