您好,登錄后才能下訂單哦!
在vue項目中實現跳轉到一個新窗口,有兩個方法:
1、<vue-link>標簽實現新窗口打開
官方文檔中說 v-link 指令被 <router-link> 組件指令替代,且 <router-link> 不支持 target="_blank" 屬性,如果需要打開一個新窗口必須要用<a>標簽,但事實上vue2版本的 <router-link> 是支持 target="_blank" 屬性的(tag="a"),如下:
<router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新頁面打開home頁</router-link>
2、編程式導航
可以使用this.$router.resolve解析出需要跳轉的url,然后用window.open打開,如下:
let routeUrl = this.$router.resolve({
path: "/share",
query: {id:96}
});
window.open(routeUrl.href, '_blank');
這種方法在抓信的安卓版本可用,但是發現在抓信iOS版本APP中無法打開新頁面。經過實踐發現,按照如下方法即可在抓信的iOS版本APP正常工作。
3, 用<a :href=variable target="_blank">
首先在頁面設置好超鏈接的跳轉代碼:
<a :href=url1 target="_blank">打開新窗口</a>
其中變量url1是頁面定義的變量:
export default {
data() {
return {
url1:"https://www.baidu.com"
}
},
methods: {
getURL() {
const url3= this.$router.resolve({
name:"guide",
params:{}
});
this.url1=url3.href;
}
},
mounted() {
this.getURL();
}
.......
這樣,就可以打開新頁面了
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。