VUE iview vue-router 跳转打开新的窗口并传递参数

最新推荐文章于 2023-07-08 22:55:54 发布
最新推荐文章于 2023-07-08 22:55:54 发布
阅读量3.1k 收藏
点赞数
分类专栏： iview vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wjm0519/article/details/102717863
版权
vue 同时被 2 个专栏收录
25 篇文章 2 订阅
订阅专栏
iview
14 篇文章 0 订阅
订阅专栏

第一种方法

1.在跳转代码上加上  tag="a" target="_blank"

2.亲测有效

第二种方法

1.通过resolve方法来实现

2.按照上面书写格式，路由会跳转到更目录打印结果如下，结果并不是我们想要的

3.将resolve下的name参数改成path完美解决

wjm0519
关注
专栏目录
Vue+iView 跳转页面并传值
qq_36649922的博客
06-02 1203
1. 打开src/store文件夹下的index.js文件，设置传入的参数temp_和判断参数 import Vue from 'vue'; import Vuex from 'vuex'; import admin from './modules/admin'; Vue.use(Vuex) export default new Vuex.Store({ state: { temp_id: '', openDialog: false }, m
ivew-admin 路由导航组件（仿浏览器新开窗口效果） 封装 项目实战
晴天有点孤单
10-24 1017
效果rt：（左右切换滚动，左侧菜单联动，支持同路由多个页面：可根据项目需求自行配置） 话不多说上代码---------------我是美丽的分割线***---------------------： 需要修改的文件 文件1.工具类需要用到的方法都在这里了 文件2：路由导航文件 文件3：入口页面引用（为了兼容多项目，这里做了入参封装处理，使用的时候按需改变一下） 下面是各文件代码 文件1： imp...
iview table点击单元格打开新页面、expand展开子组件调用父组件事件
weixin_45274678的博客
08-02 2502
一、点击单元格打开新页面 cloumns columns:[ { title: "项目名称", align: "center", width:170, key: "projectName", render: (h, params) => { //字符溢出显示省略号，鼠标悬停显示全部信息 if(params.row.projectName&&p...
vue中使用iview表格组件如何为其某一项添加click事件, 为"操作"，"详情"或者具体某一列添加链接操作
热门推荐
weixin_41870520的博客
07-23 3万+
1.为"操作"列的每一项添加点击事件       通过给 columns 数据的项，设置一个函数 render，可以自定义渲染当前列，包括渲染自定义组件，它基于 Vue 的 Render 函数。render 函数传入两个参数，第一个是 h，第二个是对象，包含 row、column 和 index，分别指当前单元格数据，当前列数据，当前是第几行。（查看官网案例：https://www.iviewui...
vue点击 路由在新窗口打开
Liu_liu57的博客
08-22 652
这是在新窗口打开要跳转的路由 const { href } = this.$router.resolve({ name: "datav", }); window.open(href, 'datav'); 当前窗口跳转路由 this.$router.push({ name: "datav" }); ...
my-vue-iview-admin:使用vue和iview实现vue-element-admin
04-05
在my-vue-iview-admin中，各个功能模块通常被封装为独立的组件，通过Vue的路由系统（vue-router）进行组织和导航。开发者可以自由定义新的路由和组件，实现功能的扩展。iView提供的组件可以无缝融入到项目中，如使用...
基于vue2+vue-router+vuex+iview的移动端的一个简易考试系统平台源码.zip
02-26
基于vue2+vue-router+vuex+iview的移动端的一个简易考试系统平台源码.zip vue-exam vue2 + vue-router + vuex 入门项目，移动端的一个简易考试系统平台，在预览效果时，请使用Chrome浏览器的移动端预览模式。 项目...
在Vue中通过vue-router实现路由嵌套
01-08
如果对Vue的路由不太熟悉 请参看我的另一篇博客：Vue学习之旅Part9：使用vue-router实现前端路由和参数传递 路由嵌套 即路由的组件内部还有子组件 适用于很多业务场景 实现路由嵌套的步骤比较简单 首先 在路由对象里...
Vue-iview-admin-demo
05-07
4. **路由管理**：Vue Router是Vue.js官方的路由管理器，它允许你根据URL定义不同的视图，并在它们之间进行平滑切换。在Vue-iView-admin-demo中，路由配置决定了用户访问的不同页面和组件。 5. **状态管理**：Vuex...
watchdog-framework-web:「停止维护」watchdog-framework的Web前端项目，基于Vue+iView-Admin+Vue-Router+Vuex开发
05-01
watchDog-framework-web是的前端项目工程，本项目基于Vue + iView-Admin + Vue-Router + Vuex + Axios开发。 使用 使用前请先安装(推荐使用8.x版本)，国内用户推荐使用。 克隆到本地 git clone git@github....
vue单页面应用打开新窗口显示跳转页面的实例
10-17
今天小编就为大家分享一篇vue单页面应用打开新窗口显示跳转页面的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue跳转方式（打开新页面）及传参操作示例
12-28
本文实例讲述了vue跳转方式（打开新页面）及传参操作。分享给大家供大家参考，具体如下： 1. router-link跳转 // 直接写上跳转的地址 <router to=/detail/one> <span class=spanfour>link跳转</span> </router> // 添加参数 <router to={path:> </router> // 参数获取 id = this.$route.query.id // 新窗口打开 <router
vue Iview 后台页面
05-15
vue Iview 搭建的后台页面 1. 自定义主题index.less 2. 国际化VUE18n 3. 动态菜单 4.自定义组件 5.组件联动 # install dependencies npm install # serve with hot reload at localhost:8080 npm run dev # build for production with minification npm run build # build for production and view the bundle analyzer report npm run build --report
iview 数据表格 列表某一列进行点击，出新弹框页
qq_40295815的博客
04-27 1829
UserNum: { title: '人数', align: 'center', minWidth: 100, key: 'UserNum', render: (h, params) => { let value = params.row.UserNum if (typeof(value) ==...
iview框架menu菜单展开的问题
weixin_45638909的博客
08-30 998
meta: { title: "测试一号", icon: "md-copy" },meta: { title: "测试二号", icon: "md-copy" },title: "测试分类一号",title: "测试分类一号",title: "测试分类一号",bug：测试一切都很顺利，但是用到实际中确无法展开。解决办法：只需要在模板中添加一个v-if即可解决。原因：渲染数据的时候页面还未渲染完成。当数据出现的时候才开始渲染即可。...
vue3.2版本 在浏览器打开一个新窗口 和 在页面弹出新窗口的写法（传参和接收参数）
weixin_44761131的博客
09-20 5551
vue3.2版本 在浏览器打开一个新窗口 和 在页面弹出新窗口的写法（传参和接收参数）
VUE路由跳转传参
每天都想吃好吃的
07-08 229
1、实现页面跳转并传参有多种方式：在template中可以使用标签实现跳转，跳转的路径是http://localhost:8080/t?index=id，如下： 只需要点击按钮就可以实现跳转，不需要写js代码，需要传递参数的话只需要即可，这样的话跳转的页面获取参数通过能够获取到完整的url,然后截取参数。也可以通过下面代码获取参数 2、跳转的路径是http://localhost:8080/t?index=id 其中需要注意，这里的to前面一定要加冒号，path的值要和上面路由定义的
vue -admin 点击跳转（打开新页面）
乐逍遥
07-14 1514
方法一： 方法二：
vue router打开新页面并传递参数，接收参数
qq_41353397的博客
01-31 2200
a页面 跳转到 b页面 未跳转的之前页面（a页面）下代码： const { href } = this.$router.resolve({ name: 'contentArticle', //需要打开的新页面vue的名字 query: { id: id //携带的参数，多个使用,隔开 } }); window.open(href, "_blank");//跳转 需要跳转到的新页面（b页面）下的代码 data() { return { id: '', }; }, created(
vue3 router-iview的v-slot
最新发布
05-25
Vue3的Router-iview是一个基于Vue3和iview框架开发的路由管理器。v-slot是Vue3新增的一种插槽语法，用于更灵活地定义组件的插槽。在Router-iview中，v-slot主要用于自定义路由导航的内容。 使用v-slot可以将路由导航的默认内容替换为自定义内容。例如，在Router-iview中，可以使用v-slot:header自定义导航栏的头部内容，v-slot:menu自定义菜单内容，v-slot:footer自定义底部内容等。 具体来说，通过在Router-iview中使用v-slot，可以让开发者更加方便地定制化路由导航的样式和功能，增强了框架的灵活性和扩展性。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值