溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

vue單頁面應(yīng)用進(jìn)入頁面加載所有js的方法

發(fā)布時(shí)間：2020-08-13 11:43:05 來源：億速云 閱讀：320 作者：小新 欄目：開發(fā)技術(shù)

這篇文章給大家分享的是有關(guān)vue單頁面應(yīng)用進(jìn)入頁面加載所有js的方法的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個參考。一起跟隨小編過來看看吧。

一般在index.js中都是這么引入的組件

import from '@/pages/my'
import Cart from '@/pages/cart'
import Order from '@/pages/order'
import TMap from '@/pages/map'
import New from '@/pages/new'

換成這樣就好啦

const My = r => require.ensure([], () => r(require('@/pages/my')), 'my')
const Cart = r => require.ensure([], () => r(require('@/pages/cart')), 'cart')
const Order = r => require.ensure([], () => r(require('@/pages/order')), 'order')
const TMap = r => require.ensure([], () => r(require('@/pages/map')), 'map')
const New = r => require.ensure([], () => r(require('@/pages/new')), 'new')

補(bǔ)充知識：vue -- router路由跳轉(zhuǎn)錯誤 , NavigationDuplicated

vue-router ≥3.0版本回調(diào)形式以及改成promise api的形式了，返回的是一個promise，如果路由地址跳轉(zhuǎn)相同, 且沒有捕獲到錯誤，控制臺始終會出現(xiàn)如圖所示的警告 （注：3.0以下版本則不會出現(xiàn)以下警告?。?！，因路由回調(diào)問題…）

方案一：

安裝vue-router3.0以下版本：先卸載3.0以上版本然后再安裝舊版本 npm install @vue-router2.8.0 -S

方案二：

針對于路由跳轉(zhuǎn)相同的地址添加catch捕獲一下異常：this.$router.push('/location').catch(err => { console.log(err) })

方案三：

在main.js下注冊一個全局函數(shù)即可

import Router from 'vue-router'

const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}

注：官方vue-router新版本路由默認(rèn)回調(diào)返回的都是promise，原先就版本的路由回調(diào)將廢棄！?。。?/p>

感謝各位的閱讀！關(guān)于vue單頁面應(yīng)用進(jìn)入頁面加載所有js的方法就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手