zoukankan      html  css  js  c++  java
  • vue seesion&localstorage

    <template>
      <div>
        <p>{{sessionStora}}</p>
      <button v-on:click="add">add</button>
      <button v-on:click="show">show</button>
      <button v-on:click="modify">modify</button>
      <button v-on:click="remove">remove</button>
      <button v-on:click="clear">clear</button>
      </div>
    </template>
    <script>
    import {setSessionStorage,getSessionStorage,modifySessionStorage,removeSessionStorage,clearSessionStorage} from "@/assets/js/sessionStorage.js"
    import {setLocalStorage,getLocalStorage,modifyLocalStorage,removeLocalStorage,clearLocalStorage} from "@/assets/js/localStorage.js"
    export default {
      data(){
        return{
         sessionStora:""
        }
      },
      methods:{
        add(){
        // setSessionStorage("a","a")
        // setSessionStorage("b","b")
        // setSessionStorage("c","c")
        // this.sessionStora=JSON.stringify(sessionStorage)
         setLocalStorage("a","a")
         setLocalStorage("b","b")
         setLocalStorage("c","c")
         this.sessionStora=JSON.stringify(localStorage)
        },
        modify(){
         //modifySessionStorage("b","pp")
        // this.sessionStora=JSON.stringify(sessionStorage)
         setLocalStorage("b","pp")
         this.sessionStora=JSON.stringify(localStorage)
        remove(){
       //  removeSessionStorage("b")
        // this.sessionStora=JSON.stringify(sessionStorage)
           removeLocalStorage("b")
       this.sessionStora=JSON.stringify(localStorage)
        },
        clear(){
         // clearSessionStorage()
         // this.sessionStora=JSON.stringify(sessionStorage)
         clearLocalStorage()
         this.sessionStora=JSON.stringify(localStorage)
        },
        show(){
          // this.sessionStora=getSessionStorage("a")
          this.sessionStora=getLocalStorage("a")
        },
      }
    }
    </script>
    <style>
    
    </style>
    //localstorage.js
    export function setLocalStorage(key,value){ localStorage.setItem(key,value) } export function getLocalStorage(key){ return localStorage.getItem(key) } export function removeLocalStorage(key){ localStorage.removeItem(key) } export function clearLocalStorage(){ localStorage.clear() }
    //sessionstorage.js
    export function setSessionStorage(key,value){ sessionStorage.setItem(key,value) } export function getSessionStorage(key){ return sessionStorage.getItem(key) } export function modifySessionStorage(key,value){ sessionStorage.setItem(key,value) } export function removeSessionStorage(key){ sessionStorage.removeItem(key) } export function clearSessionStorage(){ sessionStorage.clear() }
  • 相关阅读:
    创建Azure虚拟机之Azure Portal方式
    Windows平台启动与关闭Azure虚拟机
    Linux文件操作命令
    vue中使用图片裁剪cropperjs
    Linux权限管理之基本权限
    设计模式6大原则之【迪米特原则】
    设计模式6大原则之【接口隔离原则】
    设计模式6大原则之【单一职责原则】
    sql中的join
    Redis学习之:Redis的使用和优化
  • 原文地址:https://www.cnblogs.com/Zhengxiaoxiao/p/10868728.html
Copyright © 2011-2022 走看看