vue?路由跳轉(zhuǎn)打開(kāi)新窗口被瀏覽器攔截問(wèn)題處理
觸發(fā)事件請(qǐng)求接口根據(jù)條件去判斷在進(jìn)行路由跳轉(zhuǎn):
? <a @click="getGetMyPortfolioById(scope.row) ">查看</a>
?
?getGetMyPortfolioById(vals) {?
? ? getMyPortfolioById({
?
? ? }).then(response = >{?
? ? ? ? const routerdata = this.$router.resolve({?
? ? ? ? ? ? ? ? ? name: '組合分析以及組合持倉(cāng)',?
? ? ? ? ? ? ? ? ? params: { managerId: vals.fundCode }?
? ? ? ? })?
? ? ? ? const newhref = routerdata.href + '?managerId=' + vals.fundCode?
? ? ? ? ?window.open(newhref, '_blank')?
? ? })
?}?當(dāng)我們用以上方法時(shí)候,是觸發(fā)事件請(qǐng)求接口根據(jù)條件去判斷在進(jìn)行路由跳轉(zhuǎn),這個(gè)時(shí)候就會(huì)遇到瀏覽器被攔截的問(wèn)題
在接口請(qǐng)求的回調(diào)函數(shù)中 需要使用window.open()打開(kāi)新頁(yè)面,但是等接口請(qǐng)求成功之后,window.open()打開(kāi)新頁(yè)面總是被瀏覽器攔截,原因大概是,放在請(qǐng)求回調(diào)函數(shù)中的操作,被瀏覽器認(rèn)為不是用戶(hù)主動(dòng)觸發(fā)的事件,并且延遲1000ms ,被認(rèn)為有可能是廣告,于是被攔截
解決的方法:
在接口請(qǐng)求之前先打開(kāi)一個(gè)空的頁(yè)面:
let tempPage=window.open('' ", _blank');
然后在回調(diào)函數(shù)中:
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: '組合分析以及組合持倉(cāng)',
? ? ? ? ??? ? ?? ?params: {
? ? ? ? ? ? ? ??? ??? ?managerId: vals.fundCode
? ? ? ? ??? ??? ?}
? ? ? ?? ??? ? })
? ? ??? ??? ?const newhref = routerdata.href + '?managerId=' + vals.fundCode
? ? ??? ??? ?tempPage.location = newhref
?? ? ?})
?}到此這篇關(guān)于vue 路由跳轉(zhuǎn)打開(kāi)新窗口被瀏覽器攔截問(wèn)題處理的文章就介紹到這了,更多相關(guān)vue 路由跳轉(zhuǎn)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
vue頭部導(dǎo)航動(dòng)態(tài)點(diǎn)擊處理方法
這篇文章主要介紹了vue頭部導(dǎo)航動(dòng)態(tài)點(diǎn)擊處理方法,文中通過(guò)一段示例代碼給大家介紹了vue實(shí)現(xiàn)動(dòng)態(tài)頭部的方法,需要的朋友可以參考下2018-11-11
vue3.0實(shí)踐之寫(xiě)tsx語(yǔ)法實(shí)例
很久不寫(xiě)博客了,最近在使用ts和tsx開(kāi)發(fā)vue類(lèi)項(xiàng)目,網(wǎng)上資料比較少,順便記錄一下方便同樣開(kāi)發(fā)的人互相學(xué)習(xí)共同進(jìn)步,下面這篇文章主要給大家介紹了關(guān)于vue3.0實(shí)踐之寫(xiě)tsx語(yǔ)法的相關(guān)資料,需要的朋友可以參考下2022-07-07
Vue中對(duì)比scoped css和css module的區(qū)別
這篇文章主要介紹了Vue中scoped css和css module的區(qū)別對(duì)比,scoped css可以直接在能跑起來(lái)的vue項(xiàng)目中使用而css module需要增加css-loader配置才能生效。具體內(nèi)容詳情大家參考下本文2018-05-05
vue-router解決相同路徑跳轉(zhuǎn)報(bào)錯(cuò)的問(wèn)題
這篇文章主要介紹了vue-router解決相同路徑跳轉(zhuǎn)報(bào)錯(cuò)的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-04-04
vue3.0中ref與reactive的區(qū)別及使用場(chǎng)景分析
ref與reactive都是Vue3.0中新增的API,用于響應(yīng)式數(shù)據(jù)的處理,這篇文章主要介紹了vue3.0中ref與reactive的區(qū)別及使用,需要的朋友可以參考下2023-08-08
Vue3-KeepAlive,多個(gè)頁(yè)面使用keepalive方式
這篇文章主要介紹了Vue3-KeepAlive,多個(gè)頁(yè)面使用keepalive方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-08-08
vue移動(dòng)端城市三級(jí)聯(lián)動(dòng)組件使用詳解
這篇文章主要為大家詳細(xì)介紹了vue移動(dòng)端城市三級(jí)聯(lián)動(dòng)組件的使用,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-07-07
vue將data恢復(fù)到初始狀態(tài) && 重新渲染組件實(shí)例
這篇文章主要介紹了vue將data恢復(fù)到初始狀態(tài) && 重新渲染組件實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-09-09
Vue+Openlayer使用modify修改要素的完整代碼
這篇文章主要介紹了Vue+Openlayer使用modify修改要素的完整代碼,代碼簡(jiǎn)單易懂,對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-09-09

