清除浏览器存储

知识点

1. 清除所有的localStorage：window.localStorage.clear()
2. 清除所有的sessionStorage：window.sessionStorage.clear()
3. 清除所有的cookie：必须遍历一个一个的设置过期时间 （当前域名下的）
   var cookies = document.cookie.split(';')
   for (var i = 0; i < cookies.length; i++) {
   var cookie = cookies[i]
   var eqPos = cookie.indexOf('=')
   var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie
   document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT'
   }

代码如下：

<template>
  <section>
    <div class="main">
      <p class="btn"><button @click="clearStorage()">点击清缓存</button></p>
    </div>
  </section>
</template>
<script>
export default {
  data () {
    return {

    }
  },
  methods: {
    clearStorage () {
      window.localStorage.clear()
      window.sessionStorage.clear()
      this.deleteAllCookie()
      this.$utils.showError('成功清除缓存了哦~')
    },
    deleteAllCookie () {
      var cookies = document.cookie.split(';')
      for (var i = 0; i < cookies.length; i++) {
        var cookie = cookies[i]
        var eqPos = cookie.indexOf('=')
        var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie
        document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT'
      }
    }
  }
}
</script>
<style scoped>
  .main{
    width:100%;
    min-height:100vh;
    background:#fff;
    padding:0.4rem 0;
  }
  .info-list{
    width:100%;
    padding:0 0.3rem;
    margin-bottom:2rem;
  }
  .info-item{
    width:100%;
    margin-bottom:0.2rem;
  }
  .info-list .title{
    width:100%;
    height:0.36rem;
    line-height:0.36rem;
    font-size:0.32rem;
    margin-bottom: 0.2rem;
  }
  .info-item .content{
    width:100%;
    line-height:0.36rem;
    font-size:0.32rem;
  }
  .btn {
    height:0.4rem;
    line-height:0.4rem;
    text-align:center;
    margin-bottom:0.6rem;
  }
  button {
    font-size: 0.32rem;
    border: 0.01rem solid #000;
    padding: 0.1rem 0.2rem;
    border-radius: 0.4rem;
  }
</style>