vconsole在低版本瀏覽器上白屏問(wèn)題(包括ios Android)Vue解決方案

vconsole是一個(gè)在移動(dòng)設(shè)備上調(diào)試的神器,但是在某些手機(jī)上,會(huì)有白屏問(wèn)題。
先看報(bào)錯(cuò):

Uncaught ReferenceError: ResizeObserver is not defined,source: http://10.1.2.113:8081/js/app.js(4422)

這段報(bào)錯(cuò)指出ResizeObserver 這個(gè)方法找不到
百度找了一下這個(gè)API


image.png

這個(gè)api是用來(lái)vconsole界面大小適配用的


image.png

這個(gè)api的兼容性其實(shí)已經(jīng)算很好了,但耐不住公司有特別古老的機(jī)型在測(cè)試,最低版本的安卓也是2018年月更新的適配。

為了解決這個(gè)適配問(wèn)題

  1. 安裝resize-observer-polyfill
yarn  add resize-observer-polyfill
或者
npm i resize-observer-polyfill

2.main.js引入

import ResizeObserver from 'resize-observer-polyfill'
掛載到window上,因?yàn)椴寮?nèi)是使用的new語(yǔ)法 會(huì)直接在window上找
 window.ResizeObserver = ResizeObserver

至此,問(wèn)題解決..

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容