vue-router 在新窗口打开页面

已于 2023-09-12 09:42:00 修改
阅读量5.4k 收藏 9
点赞数 3
分类专栏： 前端开发知识 Vue 文章标签： vue.js javascript ecmascript
于 2023-05-04 10:44:38 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39335404/article/details/129987814
版权

文章目录

概述

Vue 属于单页面应用，而单页面应用中“路由”是在客户端执行的。客户端的 JavaScript 可以拦截页面的跳转请求，动态获取新的数据，然后在无需重新加载的情况下更新当前页面。这样通常可以带来更顺滑的用户体验，尤其是在更偏向“应用”的场景下，因为这类场景下用户通常会在很长的一段时间中做出多次交互。

数字化管理平台
Vue3+Vite+VueRouter+Pinia+Axios+ElementPlus
Vue权限系统案例
个人博客

Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成，让用 Vue.js 构建单页应用变得轻而易举。功能包括：

  • 嵌套路由映射
  • 动态路由选择
  • 模块化、基于组件的路由配置
了解本专栏 订阅专栏 解锁全文 超级会员免费看
MagnumHou
关注
专栏目录
订阅专栏
使用 vue-router 在新窗口打开页面
妖怪的博客
04-16 1191
1. 使用标签实现新窗口打开： 在页面导航中<router-link>被渲染为<a>标签, 在vue2版本的<router-link>支持 target="_blank" , 代码如下:<router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新窗口打开</router...
Vue中在新窗口打开页面及Vue-router的使用
08-27
主要介绍了Vue中在新窗口打开页面 及 Vue-router的使用,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
vue中开启新页面
weixin_46370288的博客
10-18 160
【代码】vue中开启新页面。
Vue中Router跳转打开新标签页
qq_54140719的博客
03-10 4585
使用router.resolve打开新标签页
Vue中在新窗口打开页面 及 Vue-router
热门推荐
Leayh
06-12 4万+
背景 在开发提分加项目的过程中，遇到了点击下拉菜单时在新窗口中打开页面，由于之前一直做的是单页面应用，没有碰到过类似的需求，于是上网搜了一下解决办法，也再次系统地温习了一下vue-router。 解决 使用路由对象的resolve方法解析路由，可以得到location、router、href等目标路由的信息。得到href就可以使用window.open开新窗口了。 const ...
Vue $router.push打开新窗口
qq_34419312的博客
09-29 6443
Vue $router.push打开新窗口
vue-router在新窗口打开页面
weixin_68966058的博客
09-04 9580
需要注意的是，router-link并不支持 target="_blank"属性，所以需要tag=“xxx”属性把router-link渲染成标签。有些时候需要在点击事件或者函数中实现页面跳转到新的界面，这时候就可以通过router.resolve()来实现。设计的渐进式框架，但是有时候在项目中也会出现新窗口打开页面的情况，此时，就需要用vue-router来解决。
vue 跳转打开新页面
一路向前的博客
08-13 3557
1.官方文档中说 v-link 指令被 组件指令替代，且 不支持 target="_blank" 属性，如果需要打开一个新窗口必须要用标签，但事实上vue2版本的 是支持 target="_blank" 属性的(tag=“a”)，如下： <router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新页面打开home页</router-link> 2.有些时候需要在单击事件或者在函数中实现页面跳转，那么可以
vue路由打开一个新的窗口
pinbolei的博客
11-29 1万+
简单说一下vue路由如何打开一个新的窗口
在vue项目中如何实现跳转到一个新页面
qq_38637619的博客
08-13 7299
记录一下在vue项目中如何实现跳转到一个新页面（一个比较简单又比较基础的问题了），有两个方法： 1、标签实现新窗口打开 官方文档中说 v-link 指令被 组件指令替代，且 不支持 target="_blank" 属性，如果需要打开一个新窗口必须要用标签，但事实上vue2版本的 是支持 target="_blank" 属性的(tag=“a”)，如下： <router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新页面
vue Router 打开一个新的页面
qq_61616359的博客
12-15 162
vue Router打开一个新的页面并携带参数
vue-router跳转时打开新页面的两种方法
10-16
主要给大家介绍了关于vue-router跳转时打开新页面的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用vue-router具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
Vue路由跳转传参或打开新页面跳转
一步一个脚印，踏实努力，向着目标前进
07-10 1万+
在Vue中，你可以使用Vue Router来进行路由跳转，并且可以通过路由参数来传递数据。
使用 vue-router 在新窗口打开页面 _@jie
tattoo_jie的博客
05-29 308
1. 使用标签实现新窗口打开： 在页面导航中<router-link>被渲染为<a>标签, 在vue2版本的<router-link>支持 target="_blank" , 代码如下: <router-link target="_blank" :to="{path:'/note'}">新窗口打开</router-link> 2. 编程式导航： 有些时候需要在单击事件或者在函数中实现页面跳转，那么可以借助router的示例方法，通过编写代码
vue router 用新标签页打开页面
最新发布
我的博客
11-09 179
【代码】vue router 用新标签页打开页面。
vue学习之vue-router在新窗口打开页面
King的博客
07-31 984
方法一：使用<router-link>标签 官方文档中说 v-link 指令被 <router-link> 组件指令替代，且 不支持 target="_blank" 属性，如果需要打开一个新窗口必须要用<a>标签，但事实上vue2版本的 是支持 target="_blank" 属性的 <router-link target="_blank" :to="/home">新页面打开home页</router-link> 方法二：编程式导航 let
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

MagnumHou

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值