基於dva框架兼容IE瀏覽器常見問題收錄
1、打開瀏覽器出現空白,控制檯報錯“對象不支持“startsWith”屬性或方法”
解決方案:
a、安裝babel-polyfill
npm install babel-polyfill --save
b、index.js入口文件頂部引用
import 'babel-polyfill';
2、IE瀏覽器GET請求緩存問題(同一個get請求相同參數會直接從緩存中拿)
方案一:
在get請求後面添加一個參數 t= 時間戳
t = new Date().getTime();
方案二:
請求頭中加:
['Cache-Control'] = 'no-cache';
['Pragma'] = 'no-cache';
3、在jsx中單獨爲特定瀏覽器設置樣式
檢測瀏覽器類型方法:
// 獲取瀏覽器類型
function getBrowserType() {
const userAgent = navigator.userAgent; //取得瀏覽器的userAgent字符串
const isOpera = userAgent.indexOf("Opera") > -1; //判斷是否Opera瀏覽器
const isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera || userAgent.indexOf("rv:11") > -1; //判斷是否IE瀏覽器
const isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE; //判斷是否IE的Edge瀏覽器
const isFirefox = userAgent.indexOf("Firefox") > -1; //判斷是否Firefox瀏覽器
const isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") === -1; //判斷是否Safari瀏覽器
const isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Safari") > -1; //判斷Chrome瀏覽器
if (isIE) {
if(userAgent.indexOf("rv:11") > -1) {
return 'IE11';
}
if(userAgent.indexOf("rv:12") > -1) { //這一段還沒驗證
return "IE12";
}
const reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
const fIEVersion = parseFloat(RegExp["$1"]);
if (fIEVersion === 7) {
return "IE7";
} else if (fIEVersion === 8) {
return "IE8";
} else if (fIEVersion === 9) {
return "IE9";
} else if (fIEVersion === 10) {
return "IE10";
} else if (fIEVersion === 11) {
return "IE11";
} else if (fIEVersion === 12) {
return "IE12";
} else {
return "0"; //IE版本過低
}
} //isIE end
if (isFirefox) return "FF";
if (isOpera) return "Opera";
if (isSafari) return "Safari";
if (isChrome) return "Chrome";
if (isEdge) return "Edge";
}
eg:
// 判斷瀏覽器類型是否爲ie
const isIE = getBrowserType().includes('IE');
<div style={{color: `${isIE ? '#FFFFFF' : '#000000'}`}}>ie中字體白色</div>
-----------未完待續,後續持續更新-------------
小夥伴們感覺有幫助的話希望點個贊喲,如果有問題或疑問歡迎大家評論區留言,看到後第一時間回覆。