Vue Store缓存sessionStorage，localStorage封装

1.安装store

 

npm install --save store

2.定义封装缓存文件 /common/storeStorage.js

 

import 'vue';

import store from 'store';
import sessionStorage from 'store/storages/sessionStorage';
import localStorage from 'store/storages/localStorage';

export const sessionStor = store.createStore(sessionStorage);
export const localStor = store.createStore(localStorage);

export const STORAGE_KEYS = {
    CITY_ID: 'EVENTS_CITY_ID',
    SPRING_BUY_INFO: 'SPRING_BUY_INFO',
    SPRING_TRADE_NO: 'SPRING_TRADE_NO',
    SPRING_PAY_AGREEMENT: 'SPRING_PAY_AGREEMENT',
    DONT_CHECK_NAVIGATION: 'DONT_CHECK_NAVIGATION',
};

export const storePlugin = (V) => {
    Object.defineProperty(V.prototype, '$session', {value: sessionStor, writable: true});
    Object.defineProperty(V.prototype, '$local', {value: localStor, writable: true});
    Object.defineProperty(V.prototype, '$STORAGE_KEYS', {value: STORAGE_KEYS, writable: true});
};

export default sessionStor;

3.在main.js中使用

 

import {storePlugin} from './common/storeStorage';
Vue.use(storePlugin);

4.在页面使用

 

var value = '1111';
this.$session.set('value1', value);
console.log(this.$session.get('value1'));
var value2 = 222;
this.$local.set('value2', value2);
console.log(this.$local.get('value2'));