router-link 返回上页 和 新窗口打开链接

时间:2022-12-25 12:46:23

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

this.$router.go(-1)

实现返回;

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

window.history.go(-1)

实现返回效果。

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

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

也可直接简写:

@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')
}

router-link 返回上页 和 新窗口打开链接的更多相关文章

  1. javascript新窗口打开链接window&period;open&lpar;&rpar;被阻拦的解决办法

    场景是ajax提交,比较后端效验数据,需要用户登录,提示后并需要新窗口打开登录的链接,使用window.open(url);往往会被浏览器认为是广告而被拦截. data.url是ajax返回的链接地址 ...

  2. 让你的wordpress在新窗口打开链接

    在使用wordpress过程中笔者发现还有一些不太完善的地方,没有充分考虑到用户体验.所以,在使用wordpress建博之初,我们有必要对wordpress进行一次小改造,让wordpress更个性. ...

  3. 如何用CSS实现在新窗口打开链接?

    *如何用CSS实现在新窗口打开链接? <style type="text/css"> <!-- .target2 a:active {test:expressio ...

  4. 更喜欢从一而终?bing测试在新窗口打开链接遭美国网友痛批

                  原链接地址:http://www.cnbeta.com/articles/186529.htm 我们都知道在中国网站点击一个链接之后,默认在新窗口或新标签打开,大家也很熟悉 ...

  5. jquery新窗口打开链接

    第一种:下面的代码是针对m35ui这个样式下的a都是在新窗口打开    <script type="text/javascript">  jQuery(document ...

  6. c&num;&colon; WebBrowser 禁止在新窗口打开链接

    项目中碰到此需求.几番比对,此为最好的解决方案,聊做备忘. 1.加入Microsoft Internet Controls引用: 项目右键->添加引用->COM->Microsoft ...

  7. selenium实现在新窗口打开链接

    问题:页面代码中不存在target="_blank",怎么实现点击一个按钮,在新窗口中打开? WebElement link = element.findElement(By.ta ...

  8. vue编程式路由实现新窗口打开

    一. 标签实现新窗口打开: 官方文档中说 v-link 指令被 组件指令替代,且 不支持 target=”_blank” 属性,如果需要打开一个新窗口必须要用标签,但事实上vue2版本的 是支持 ta ...

  9. CefSharp禁止弹出新窗体,在同一窗口打开链接,或者在新Tab页打开链接,并且支持带type&equals;&quot&semi;POST&quot&semi; target&equals;&quot&semi;&lowbar;blank&quot&semi;的链接

    说明:在同一窗口打开链接,只要稍加改造就可以实现,这里实现的是在新Tab页打开链接,并且支持带type="POST" target="_blank"的链接 gi ...

随机推荐

  1. Overview of the Oppia codebase(Oppia代码库总览)

    Oppia is built with Google App Engine. Its backend is written in Python, and its frontend is written ...

  2. asp&period;net 使用 MongoDB 初体验

    首先:驱动 如果asp.net 想使用MongoDB,.net没有自带的链接类.得用第三方或官方的链接类. 当然有很多种驱动,我就不一一介绍了. 今天我就介绍一个我比较常用的驱动-----MongoD ...

  3. html字符实体对照表

  4. ref string

    string pics=""; pSub.GetSubjectContent(pddm,ref  pics); public string GetSubjectContent(st ...

  5. POJ 1743 Musical Theme &lpar;Hash&rpar;

    Musical Theme Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 33820   Accepted: 11259 D ...

  6. 域名系统DNS简介

    域名系统(Domain Name System, DNS)是互联网的核心应用层协议之一, 它用于查询域名对应的IP地址.在使用域名访问任何网络资源时都需要先进行域名解析. www.cnblogs.co ...

  7. git 码云的常用命令(版本控制)

    首先在码云仓库创建对应的仓库 当你输入错误用户名和密码 需要清掉配置 git config --system --unset credential.helper 设置账号 git config --g ...

  8. Mongodb之使用rpm包安装配置启动

    下载rpm包 wget https://mirrors.aliyun.com/mongodb/yum/redhat/7Server/mongodb-org/3.2/x86_64/RPMS/mongod ...

  9. stark - 4 ⇲ 视图函数

    ✘  list_view 处理表格(默认是显示表结构的所有字段) 1 list_display = self.get_list_display() # 4.1处理表头 header_list = [] ...

  10. 【排序】希尔排序,C&plus;&plus;实现

    原创博文,转载请注明出处! 本文代码的github地址 # 基本思路       希尔排序是”直接插入排序“的改进版,也称为“缩小增量排序”.基本原理:先将待排序的数组元素分成多个序列,然后对每个子序 ...