官方文檔的main.js
是這樣寫(xiě)的:
import Vue from 'vue'
...
new Vue({
el: '#app',
router,
store,
render: h => h(App)
})
而我們?cè)跀r截http
時(shí)载慈,有可能以為token
無(wú)效跳轉(zhuǎn)到登錄:
NProgress.configure({ showSpinner: false }) // NProgress Configuration
router.beforeEach(async (to, from, next) => {
// 全局前置守衛(wèi),當(dāng)有路由進(jìn)行跳轉(zhuǎn)時(shí)就會(huì)進(jìn)入這個(gè)守衛(wèi)
NProgress.start() // 開(kāi)始加載進(jìn)度條
document.title = getPageTitle(to.meta.title)// 設(shè)置頁(yè)面標(biāo)題
const hasToken = getToken() // 判斷用戶是否登錄慨绳,也就是是否能獲得token值阅爽,
if (hasToken) {
...
next()
} else {
window.location.replace(process.env.VUE_APP_API); // 這種方式是跳轉(zhuǎn)到外部鏈接登錄
// 或者跳轉(zhuǎn)到內(nèi)部鏈接login路由
}
})
router.afterEach(() => {
// 全局后置鉤子
NProgress.done()
})
但是我們?cè)谶@里無(wú)法拿到this
,所以這么才能走this.$router.push({ name: "xxx", params: { xx } });
呢挟伙。
很簡(jiǎn)單楼雹,就在main.js
里面拿出Vue
就行:
let vue = new Vue({
el: '#app',
router,
store,
render: h => h(App)
})
export default vue
然后再攔截里面引入main
就可以拿到vue
了:
import vue from './main.js'
...
vue.$router.push({ name: "xxx", params: { xx } })