在后續(xù)操作中發(fā)現(xiàn)遇到了bug蠕搜,
const newList = clone(recordList)
.filter(r => r.type === this.type)
.sort((a, b) => dayjs(b.createdAt).valueOf() - dayjs(a.createdAt).valueOf());
這里由于clone后發(fā)現(xiàn)無法用sort和filter,報錯
Parameter 'b' implicitly has an 'any' type.
,上google看怎么解決問題的時候發(fā)現(xiàn)有人認為可以在tsconfig.json 中 添加"noImplicitAny": false,從而關(guān)閉這個的檢查瘤旨,而后我自己上了ts的官方看了文檔烟很,發(fā)現(xiàn)其實可以這樣解決
function clone<T>(data: T): T {//data什么類型返回什么類型
return JSON.parse(JSON.stringify((data)));
}
就是直接返回data的類型,從而使得不會因為隱式含有所有的類型而導致無法通過檢查蜓耻。
由于發(fā)現(xiàn)非常多的地方都用到了深拷貝茫舶,包括了Store里面的很多操作,所以我選擇將這個操作封裝成一個clone的操作刹淌,使得很多地方可以直接拿來用
function clone(data:any) {
return JSON.parse(JSON.stringify((data)));
}
export default clone;
做項目的時候遇到問題
saveRecord(){
this.recordList.push(this.record)
}
這個時候如果修改后面數(shù)據(jù)饶氏,前面也會出現(xiàn)變化。
這是為啥呢有勾?
在我仔細研究了內(nèi)存圖的原理和查閱了一些資料我發(fā)現(xiàn)疹启,這里push的時候每次都是依照原來的this.record進行push。這樣就意味著后面push進入內(nèi)存的實際地址沒有改變蔼卡,比如第一個地址是101喊崖,后面也都是101,所以后面的進行數(shù)值改變比如第一個push的時候push了a=2
,那后面push的時候改成a=3
贷祈,實際上并沒有創(chuàng)建一個新的對象趋急,而僅僅是改變了a的屬性,所以前面push的也都變成了a=3
解決方法
saveRecord(){
const newRecord=JSON.parse(JSON.stringify(this.record))//深拷貝一個
this.recordList.push(newRecord)
}