场景

若依前后端分离版本地搭建开发环境并运行项目的教程：

https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/108465662

在此基础上，如果想在某页面上添加一个按钮，点击此按钮页面跳转到新的页面，并设置在页面的

新窗口页中打开。

注：

博客：
https://blog.csdn.net/badao_liumang_qizhi
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

首先找到vue项目下的router下的index.js

然后添加路由的配置

    {path: '/webclient',component: webclientlogin,},

其中上面path是跳转时的路径，下面是跳转的组件，所以还需要将此组件引入

import webclientlogin from '@/views/system/webclient/webclientlogin'

然后在要跳转的页面中添加一个按钮

        <el-buttontype="primary"plainicon="el-icon-plus"size="mini"@click="webclientlogin">Web版本</el-button>

在按钮的点击事件中

    webclientlogin() {let routeData = this.$router.resolve({ path: '/webclient', query: {  id: 1 } });window.open(routeData.href, '_blank');},

如果需要传递参数的话则添加query，不需要的话则不传递。

则会在新窗口页中打开。

若依前后端分离版(vue)中配置页面跳转的路由相关推荐

使用SpringBoot + Vue (若依前后端分离版) 写项目的一些总结(持续更新...)
使用SpringBoot + Vue(若依前后端分离版) 写项目的一些总结获取Redis服务 @Autowired private RedisCache redisCache; String cap ...
若依前后端分离版手把手教你本地搭建环境并运行项目
场景 RuoYi-Vue是一款基于SpringBoot+Vue的前后端分离极速后台开发框架. RuoYi 官网地址:http://ruoyi.vip RuoYi 在线文档:http://doc.ruo ...
若依前后端分离版怎样根据数据库生成代码并快速实现某业务的增删改查
场景使用若依的前后端分离版,怎样使用其代码生成实现对单表的增删改查导出的业务. 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号霸道的程 ...
若依管理系统前后端分离版基于ElementUI和SpringBoot怎样实现Excel导入和导出
场景使用若依前后端分离版实现Excel的导入和导出. 前端:Vue+ElementUI 后端:SpringBoot+POI+Mysql 注: 博客: https://blog.csdn.net/ba ...
若依前后端分离版怎样修改主页面显示请求的SpringBoot后台数据
场景使用若依的前后端分离版,本来的首页效果是现在如果要根据具体业务实现从后台获取要显示的数据实现类似下面的效果注: 博客: https://blog.csdn.net/badao_liumang ...
若依权限系统分析（前后端分离版）
若依权限系统分析一:故事背景二:具体权限控制 2.1 页面权限控制 2.2 页面元素权限控制三:实现前端鉴权 3.1 封装js与权限交互 3.1.1 uni-app自带uni-request与权 ...
若依前后端分离版怎样去掉登录验证码
场景若依前后端分离版手把手教你本地搭建环境并运行项目: 若依前后端分离版手把手教你本地搭建环境并运行项目_BADAO_LIUMANG_QIZHI的博客-CSDN博客_若依前后端分离版本的配置上面在 ...
若依前后端分离版数据库已经存在的字典添加一条后刷新没作用，必须清除Redis缓存
场景使用若依的前后端分离版,前端下拉框的使用直接查询的是字典表中的数据. 对于某个类型的字典如果之前已经添加过并使用过,后来想要再添加一条此类型的字典. 在数据库中添加后,前端刷新下,发现没有获取到 ...
若依前后端分离版怎样修改主页面和浏览器上的图标和标题
场景使用若依的前后端分离版,,其默认的图标和标题等如下如果想要修改为自己想要的标题和图标,实现类似下面的效果注: 博客: https://blog.csdn.net/badao_liumang_ ...

若依前后端分离版(vue)中配置页面跳转的路由

场景

实现

若依前后端分离版(vue)中配置页面跳转的路由相关推荐

最新文章

热门文章