例如有些項(xiàng)目用到了圖表(echarts),可以按需引入依賴(lài)包阴挣,不用加載整個(gè)echarts庫(kù)虽抄。
vue項(xiàng)目打包的時(shí)候?qū)?map文件忽略扑毡,不需要編譯打包出來(lái)。這樣文件就會(huì)小很多
(注意:dist 文件,想要恢復(fù)。需要有.map文件 通過(guò)source-map還原)
- input 防抖 (在某個(gè)時(shí)間段內(nèi)只執(zhí)行最后一次)
- 上拉加載 節(jié)流 (執(zhí)行一次之后,在一段時(shí)間之后才可以再次執(zhí)行)
實(shí)現(xiàn)方法:
- 可通過(guò)setTimeOut(fn,delay) 延時(shí)
- 也可以使用時(shí)間戳 相減大于這個(gè)范圍才可以再次執(zhí)行
( 什么時(shí)候使用防抖和節(jié)流晶密,需要根據(jù)業(yè)務(wù)需求)
4.解決H5頁(yè)面緩存問(wèn)題 (服務(wù)渲染,可以防止緩存問(wèn)題 為什么 在ajax 知識(shí)點(diǎn)中
dataType 屬性中)
1.在ajax發(fā)送請(qǐng)求前加上 anyAjaxObj.setRequestHeader(“Cache-Control”,”no-cache”)模她。
2.在url后面加上一個(gè)隨機(jī)數(shù)“fresh=”+Math.random()
3.在url后面加上要給時(shí)間戳 “newTime=”+new Date().getTime()
5.按鈕的節(jié)流操作
在規(guī)定的時(shí)間內(nèi)不許可重復(fù)點(diǎn)擊稻艰,防止多次請(qǐng)求后臺(tái)接口。
6.v-for v-if
禁止不在同一級(jí)中使用侈净,解決方法:1.將v-if放在v-for循環(huán)外面 2. 利用計(jì)算屬性對(duì)數(shù)組進(jìn)行操作尊勿,然后在循環(huán)
7.v-for key key的主要作用時(shí)高效的更新虛擬dom
key 用數(shù)組中的唯一性 id 盡量不用index
如果使用key =index 只是進(jìn)行渲染還好,如果還對(duì)數(shù)組進(jìn)行操作畜侦,就會(huì)出現(xiàn)bug了
因?yàn)槟闳绻麆h除或者增加元素的時(shí)候元扔,index都會(huì)變化,當(dāng)為選擇功能的時(shí)候旋膳,選擇的時(shí)候就會(huì)不準(zhǔn)確澎语,出現(xiàn)問(wèn)題⊙榘茫或者渲染的時(shí)候擅羞,刪除的當(dāng)前元素后面的所有都重新渲染一遍,因?yàn)楫?dāng)前index改變了义图,后面的都會(huì)受到影響减俏,導(dǎo)致性能降低。
input textarea 編輯提交的時(shí)候碱工,要過(guò)濾html<>標(biāo)簽娃承。,并且要把尖括號(hào)轉(zhuǎn)義痛垛。防止提交<html></html>代碼影響前端草慧。例如:走馬燈標(biāo)簽代碼
每次切換路由的時(shí)候都讓頁(yè)面回到最頂部
scrollBehavior (to, from, savedPosition) {
return { x: 0, y: 0 }
}
寫(xiě)在 配置路由項(xiàng)的下邊
10.禁止htmlF12調(diào)試
//禁止調(diào)試
setInterval(function() {
check()
}, 1000);
var check = function() {
function doCheck(a) {
if (("" + a/a)["length"] !== 1 || a % 20 === 0) {
console.log('調(diào)試')
//
(function() {
}
["constructor"]("debugger")()
)
} else {
// window.location.
(function() {}
["constructor"]("debugger")()
)
}
doCheck(++a)
}
try {
doCheck(0)
} catch (err) {}
};
check();
檢測(cè)當(dāng)前實(shí)在pc還是app中
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid = sUserAgent.match(/android/i) == "android";
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
//app
} else {
//pc
// window.location.
}