在我們開(kāi)發(fā)商城類(lèi)的項(xiàng)目中让禀,少不了開(kāi)發(fā)購(gòu)物車(chē)的功能,在剛開(kāi)始接觸購(gòu)物車(chē)功能的時(shí)候也是一籌莫展,經(jīng)過(guò)在度娘上搜索也沒(méi)有完整的功能流纹,所以就根據(jù)自己開(kāi)發(fā)的實(shí)際項(xiàng)目,寫(xiě)一段完整的js代碼违诗。
首先創(chuàng)建一個(gè)js文件,這里面使用的都是ES語(yǔ)法
//獲取LocalStorage
let locals = window.localStorage;
let prodTools = {
//添加或者更新
addOrUpdate (prod) { //id:num
//獲取原來(lái)的數(shù)據(jù)對(duì)象,查
let prods = this.getProds();
if(prods[prod.id]) {
//如果商品存在追加
prods[prod.id] += prod.num;
}else{
//商品部存在漱凝,直接賦值
prods[prod.id] = prod.num;
}
//保存
this.save(prods)
},
//刪除
delProds(id){
let prods = this.getProds();
//prods[id] = null;
//刪除key
delete prods[id];
this.save(prods);
},
getProds(){
//默認(rèn)第一次诸迟,沒(méi)有數(shù)據(jù)
return JSON.parse(locals.getItem('prods') || '{}');
},
save(prods){
locals
}
}