今天做了一個功能是點擊按鈕路由跳轉打開新的窗口頁面

第一種方法

<router-link target="_blank" :to="{path:'/FundManger/FundProductMoney', query:{managerId:fundcode}}></router-link>"

第二種方法

<a @click="getGetMyPortfolioById(scope.row) ">查看</a>getGetMyPortfolioById(vals) { getMyPortfolioById({}).then(response = >{ const routerdata = this.$router.resolve({ name: '組合分析以及組合持倉', params: { managerId: vals.fundCode } }) const newhref = routerdata.href + '?managerId=' + vals.fundCode window.open(newhref, '_blank') })}

當我們用到第二種方法時候，是觸發事件請求接口根據條件去判斷在進行路由跳轉，這個時候就會遇到瀏覽器被攔截的問題
在接口請求的回調函數中 需要使用window.open（）打開新頁面，但是等接口請求成功之后，window.open（）打開新頁面總是被瀏覽器攔截，原因大概是，放在請求回調函數中的操作，被瀏覽器認為不是用戶主動觸發的事件，并且延遲1000ms ，被認為有可能是廣告，于是被攔截

解決的方法：

在接口請求之前先打開一個空的頁面
let tempPage=window.open(’’ ", _blank’);
然后在回調函數中，
tempPage.location=url;

第二種方法（改良版）

<a @click="getGetMyPortfolioById(scope.row) ">查看</a>getGetMyPortfolioById(vals) {const tempPage = window.open('', '_blank')getMyPortfolioById({}).then(response = >{const routerdata = this.$router.resolve({name: '組合分析以及組合持倉',params: {managerId: vals.fundCode}})const newhref = routerdata.href + '?managerId=' + vals.fundCodetempPage.location = newhref})}

總結

以上是生活随笔為你收集整理的vue 路由跳转打开新窗口(被浏览器拦截)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。