【VueRouter】vue路由跳轉打開新窗口


需求

因為某些原因,某個頁面的加載需要很長時間。為了不讓用戶重新加載,再次等待很長時間,決定當從這個頁面跳轉其他頁面時,打開一個新窗口。

編程時導航

使用路由對象的resolve方法解析路由,可以得到location、router、href等目標路由的信息。得到href就可以使用window.open開新窗口了。

當頁面有一個跳轉時

const { href } = this.$router.resolve({
    name: "router-name",
    query: {
        id: 1
    }
});
window.open(href, '_blank');

當頁面有多個跳轉時

let routeOne = this.$router.resolve({
    name: "router-one",
    query: {
        id: 1
    }
 });
 window.open(routeOne.href, '_blank');

 let routeTwo = this.$router.resolve({
    name: "router-two",
    query: {
        id: 1
    }
 });
 window.open(routeTwo.href, '_blank');

<router-link>標簽

<router-link tag="a" 
             target="_blank"
             :to="{ name: 'router-name', query: {id: 1} }">
</router-link>

轉自:https://www.jianshu.com/p/a8f3bab39f07


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM