簡述vue路由打開一個新的窗口的方法
更新時間：2018年11月29日 08:51:52 作者：pinbolei
這篇文章主要介紹了vue路由打開一個新的窗口的方法,本文給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下
簡單說一下vue路由如何打開一個新的窗口
1.router-link標簽
在vue的官方文檔中
看到這大家應該會想，既然router-link不支持target="_blank"屬性，那我們該怎么用router-link打開一個新的窗口呢？別急，繼續(xù)往下看~
文檔中還有一處描述
router-link添加tag="li"屬性后，居然可以變成li標簽渲染出來，真特么神奇哈，那可不可以寫成tag="a",從而去替代a標簽呢？我們嘗試著寫一哈
<router-link tag="a" target="_blank" to="/about">新品</router-link>
2.編程導航
上圖是官網(wǎng)的最新說法，vue2.0以后router.go和router.push就不支持新窗口打開的屬性了，現(xiàn)在用一種新的方式router.resolve
let routeData = this.$router.resolve({
path: "/about",
query: {
name:'lei',
age: 18,
phoneNum:12345678901
}
});
window.open(routeData.href, '_blank');
總結(jié)
以上所述是小編給大家介紹的vue路由打開一個新的窗口的方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家詳細介紹了如何基于Vue2實現(xiàn)數(shù)字縱向滾動效果,從而達到顯示計時器滾動效果,感興趣的小伙伴可以跟隨小編一起學習一下2024-03-03
這篇文章主要為大家詳細介紹了Vue實現(xiàn)時間軸效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要介紹了在Vue中實現(xiàn)回車鍵切換焦點的方法，本文給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2020-02-02
在現(xiàn)代前端開發(fā)中,Vue.js憑借其輕量級和易用性,成為了很多開發(fā)者的首選框架,本文將結(jié)合實際案例,詳細講解Vue-Router路由懶加載的用法,需要的可以參考下2024-11-11
該文章主要介紹了如何在Vue項目中解決IE瀏覽器的兼容性問題,包括解決IE不兼容axios的Promise對象、ES6語法以及polyfill的使用方法,通過配置babel-polyfill、es6-promise和轉(zhuǎn)ES5語法,解決了在IE瀏覽器中常見的兼容性問題,需要的朋友可以參考下2025-01-01
vue3+ts+EsLint+Prettier規(guī)范代碼的方法實現(xiàn)
本文主要介紹在Vue3中使用TypeScript做開發(fā)時，如何安裝與配置EsLint和Prettier，以提高編碼規(guī)范。感興趣的可以了解一下2021-10-10
項目中我們可能會碰到導出Excel文件的需求，這篇文章主要介紹了vue中導出Excel表格的實現(xiàn)代碼，非常具有實用價值，需要的朋友可以參考下2018-10-10
這篇文章主要介紹了vue的$http的get請求要加上params操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11
elementUI Pagination 分頁指定最大頁的問題及解決方法(page-count)
項目中遇到數(shù)據(jù)量大,查詢的字段多,但用戶主要使用的是最近的一些數(shù)據(jù),1萬條以后的數(shù)據(jù)一般不使用,這篇文章主要介紹了elementUI Pagination 分頁指定最大頁的問題及解決方法(page-count),需要的朋友可以參考下2024-08-08
這篇文章主要介紹了vue3修改link標簽默認icon無效問題詳解，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-10-10