這篇文章主要為大家展示了“Vue beforeRouteEnter中next執(zhí)行時機(jī)的示例分析”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“Vue beforeRouteEnter中next執(zhí)行時機(jī)的示例分析”這篇文章吧。

創(chuàng)新互聯(lián)是一家專業(yè)提供鄢陵企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站設(shè)計制作、成都網(wǎng)站建設(shè)、H5頁面制作、小程序制作等業(yè)務(wù)。10年已為鄢陵眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站制作公司優(yōu)惠進(jìn)行中。

背景

在用vue實現(xiàn)界面的時候，想在beforeRouteEnter鉤子函數(shù)中去獲取數(shù)據(jù)，然后通過next方法設(shè)置到跳轉(zhuǎn)頁面的實例中，結(jié)果發(fā)現(xiàn)數(shù)據(jù)一直沒辦法在界面渲染的時候賦值，苦思不得其解，遂google之，終尋原因，記錄之。

注意

beforeRouteEnter (to, from, next) {
 console.log(this); //undefined，不能用this來獲取vue實例
 console.log('組件路由鉤子：beforeRouteEnter');
 next(vm => {
  console.log(vm); //vm為vue的實例
  console.log('組件路由鉤子beforeRouteEnter的next');
 });
 }

next(vm=>{console.log(‘next') })

這個里面的代碼很晚執(zhí)行，執(zhí)行時機(jī)在組件mounted周期之后

拓展知識：對vue中的beforeRouteEnter()和beforeRouteLeave()的函數(shù)解釋

1、beforeRouteEnter(to, from, next){

要執(zhí)行的代碼操作

next();

}

beforeRouteEnter：進(jìn)入路由之前執(zhí)行的函數(shù)。

next();   --》 必須有這個，相當(dāng)于一個按鈕開啟一樣。

2、beforeRouteLeave(to, from, next){

要執(zhí)行的代碼操作

next();

}

beforeRouteLeave：離開路由之前執(zhí)行的函數(shù)。

next();   --》 必須有這個，相當(dāng)于一個按鈕開啟一樣。

以上是“Vue beforeRouteEnter中next執(zhí)行時機(jī)的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

文章標(biāo)題：VuebeforeRouteEnter中next執(zhí)行時機(jī)的示例分析-創(chuàng)新互聯(lián)
網(wǎng)站URL：http://www.ekvhdxd.cn/article28/doiicp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信小程序、軟件開發(fā)、網(wǎng)站維護(hù)、搜索引擎優(yōu)化、網(wǎng)站營銷、服務(wù)器托管

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)