之前在做一個vue項目,使用vue-router進行路由跳轉,
切換頁面的時候,需要在頁面跳轉之前進行一些判斷操作,便沒有使用router-link這個標簽,而是使用了a標簽,
我的需求是,從/stastic路由跳轉至/fullView路由,然后在fullView頁面點擊返回,返回至stastic頁面
當時stastic頁面是這么寫的
<a href="#" @click="goFullView(list.id)">查看</a>
goFullView (id) {
this.$router.push({path: '/fullView',query: {id: id}})
},
項目運行之后,從一級頁面通過這個鏈接走進goFullView方法之后,
路由確實跳轉成功,可地址欄顯示卻是http://localhost:8083/#/這種,本應該是http://localhost:8083/#/fullView?id=1這種形式,(不是百分百這種情況,也有時候地址欄會正常顯示)
此時點擊二級頁面的返回按鈕,沒有返回到stastic頁面,而是返回了首頁,
解決方法:把a鏈接的href屬性去掉,或者改為href="javascript:;" 就可以了
問題就出現在a鏈接身上了,router-link標簽進行路由跳轉,其實也是使用a標簽,href屬性值指向即將要跳轉的url,如果值為#,表示不進行頁面跳轉,通常也使用這個實現回到頂部的效果,如果值為javascript:;則表示執行了一條空的js語句,地址不發生跳轉,然后執行click方法,寫法上跟javascript:void(0);一個意思,
用錯了href屬性,鬧笑話了哈哈