本地存储的增查改删

概述

h5的本地存储有时还是挺有用的，比如这样的使用场景： image.png

素材选项卡可以加入自己的收藏夹或专题中，这个数据存到库里面就不合适了，反正都是用户自己看的东西，直接存浏览器就ok。
我们可以把想收藏的数据id用数组存下来，然后序列化后存入localStorage中，当下次用户进来的时候，可以去localStorage里面找一下，如果存在这条id，就让收藏夹的小星星点亮即可。

代码

      findStatus(k,v){ //查找数据
        if(localStorage.getItem(k)) {
         
         
          let arr  = JSON.parse(localStorage.getItem(k));
          return arr.findIndex(item=>item === v);
        }
        
      }
      storeStatus(k,v){//存储数据
        let arr = [];
        if(localStorage.getItem(k)) {
         
         
          arr = JSON.parse(localStorage.getItem(k));
        }
        
        arr.push(v);
        localStorage.setItem(k,JSON.stringify([...new Set(arr)])); // 记录在本地
          
      }
      removeStatus(k,v) { //删除数据
    
         let arr = [];
        if(localStorage.getItem(k)) {
         
         
          arr = JSON.parse(localStorage.getItem(k));
        }
        let index = arr.findIndex(item=>item === v);
        if(index > -1) {
          arr.splice(index,1);
          localStorage.setItem(k,JSON.stringify([...new Set(arr)])); // 记录在本地
        }
        
          
      }