路由器设置和使用是网络连接的基本操作，如果您是新手，本文路由跳转打开新的页面将为您提供易于理解的设置方法和技巧。

本文目录一览：

• 1、Vue路由的页面跳转打开新页面
• 2、react中路由跳转，当前页面上直接打开新标签页，重新开一个单独的页面
• 3、React中路由操作、页面跳转

Vue路由的页面跳转打开新页面

效果与a标签的target=_blank是一样的，只不过不用点击，直接打开

1、在router.js里新加一个路由

 {

    path: '/previewFile',

    name: 'previewFile',

    meta: {

      title: '预览文件',

      hideInMenu: true

    },

    component: () = import('@/view/audits/coms/previewFile.vue')

  }, 

2、在需要跳转的逻辑方法里加,这里必须用query，否则参数获取不到，亲测有效

const { href } = this.$router.resolve({

                    path: `/previewFile`,

                    query:{url:res.data.Url}                    

                });

                window.open(href, '_blank');

3、跳转页获取参数：let url=this.$route.query.url;

react中路由跳转，当前页面上直接打开新标签页，重新开一个单独的页面

当前页面不关闭的情况下，需要重开启一个新页面

1、设置需要跳转页面的路由：router.config.js

2、获取绝对路径实现新标签页开启页面

React中路由操作、页面跳转

一般适用于，点击按钮或其他组件进行页面跳转，具体使用方式如下：

react-router-redux 中包含以下几个函数，一般会结合redux使用：

具体使用时通过发送disppatch来进行页面跳转：

一般在完成某种操作，需要返回上一个页面时使用。

首先定义路由为 :

点击事件跳转到新页面 打开一个新的tab：

在新的页面获取路径上的参数：

获取路径参数 :

或者

......未完 待更

本文所提供的路由器使用教程，可以让你轻松了解网络，掌握技巧。