localStorage与sessionStorage的使用场景

localStorage为永久存储，只要不手动清除缓存，缓存的变量会一直存在，适用于仅存在一次

例：显示红点适用localStorage缓存变量，变量存在即隐藏红点，退出系统再次进入依然没有红点（只要不手动清除缓存，红点不会再出现）

//红点       
 <div class="com-red-dot" v-show="hasCollectionRedDot"></div>

 

//跳转详情页面时缓存此变量，判断用户是否进入过详情，进入后返回红点消失
localStorage.setItem('hasCollectionRedDotVal', 0);

//hasCollectionRedDot在return中声明，此方法写在created()或 mounted() 方法中
if (localStorage.getItem('hasCollectionRedDotVal')==0) {
      this.hasCollectionRedDot = false;
    }

 

sessionStorage为临时存储，仅作用于当下，关闭系统即清空缓存

例：显示红点适用sessionStorage缓存变量，变量存在即隐藏红点，退出系统再次进入红点依然存在

//红点       
 <div class="com-red-dot" v-show="hasCollectionRedDot"></div>

//跳转详情页面时缓存此变量，判断用户是否进入过详情，进入后返回红点消失
sessionStorage.setItem('hasCollectionRedDotVal', 0);

 

//hasCollectionRedDot在return中声明，此方法写在created()或 mounted() 方法中  
  if (sessionStorage.getItem('hasCollectionRedDotVal')==0) {
      this.hasCollectionRedDot = false;
    }