簡述vue路由打開一個(gè)新的窗口的方法
更新時(shí)間：2018年11月29日 08:51:52 作者：pinbolei
這篇文章主要介紹了vue路由打開一個(gè)新的窗口的方法,本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
簡單說一下vue路由如何打開一個(gè)新的窗口
1.router-link標(biāo)簽
在vue的官方文檔中
看到這大家應(yīng)該會(huì)想，既然router-link不支持target="_blank"屬性，那我們該怎么用router-link打開一個(gè)新的窗口呢？別急，繼續(xù)往下看~
文檔中還有一處描述
router-link添加tag="li"屬性后，居然可以變成li標(biāo)簽渲染出來，真特么神奇哈，那可不可以寫成tag="a",從而去替代a標(biāo)簽?zāi)?？我們嘗試著寫一哈
<router-link tag="a" target="_blank" to="/about">新品</router-link>
2.編程導(dǎo)航
上圖是官網(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路由打開一個(gè)新的窗口的方法，希望對(duì)大家有所幫助，如果大家有任何疑問請給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
使用VUE+iView+.Net Core上傳圖片的方法示例
這篇文章主要介紹了使用VUE+iView+.Net Core上傳圖片的方法示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-01-01
vue使用require.context實(shí)現(xiàn)動(dòng)態(tài)注冊路由
這篇文章主要介紹了vue使用require.context實(shí)現(xiàn)動(dòng)態(tài)注冊路由的方法，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2020-12-12
vue3使用vue-i18n的方法詳解(ts中使用$t,?vue3不用this)
所謂的vue-i18n國際化方案就是根據(jù)它的規(guī)則自己建立一套語言字典,對(duì)于每一個(gè)字（message）都有一個(gè)統(tǒng)一的標(biāo)識(shí)符,下面這篇文章主要給大家介紹了關(guān)于vue3使用vue-i18n(ts中使用$t,?vue3不用this)的相關(guān)資料,需要的朋友可以參考下2022-12-12
使用Vite+Vue3+Vant全家桶快速構(gòu)建項(xiàng)目步驟詳解
這篇文章主要為大家介紹了使用Vite+Vue3+Vant全家桶快速構(gòu)建項(xiàng)目步驟詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-06-06
這篇文章主要為大家詳細(xì)介紹了vue圖片加載與顯示默認(rèn)圖片的實(shí)例代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-03-03
在Web應(yīng)用程序中,實(shí)現(xiàn)拖拽和排序功能是非常常見的需求,本文為大家介紹了如何使用Vue來實(shí)現(xiàn)一個(gè)簡單但功能強(qiáng)大的拖拽與排序功能,感興趣的小伙伴可以參考下2023-10-10
vue實(shí)現(xiàn)三級(jí)頁面跳轉(zhuǎn)功能
這篇文章主要介紹了vue實(shí)現(xiàn)三級(jí)頁面跳轉(zhuǎn)功能,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-05-05
vue項(xiàng)目使用$router.go(-1)返回時(shí)刷新原來的界面操作
這篇文章主要介紹了vue項(xiàng)目使用$router.go(-1)返回時(shí)刷新原來的界面操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-07-07
這篇文章主要介紹了淺談 Vue 項(xiàng)目優(yōu)化的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-12-12
這篇文章主要介紹了Vue項(xiàng)目中使用Vux的安裝過程,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2018-05-05