vue-localstorage2

Lightweight localStorage plug-in for Vue2.0. （中文文档）

Features

Add namespace automatically according to the component name
Object storage friendly
similar lodash/get method can be used when obtaining storage values
could modify single property of the storaged object directly

Install

$ npm i vue-localstorage2 -S

Usage

import localStorage2 from 'vue-localstorage2'
import Vue from 'vue'

Vue.use(localStorage2)

Options

Vue.use(localStorage2, {
  prefix: '<storage_prefix>', // default `app`
  namespace: false            // default `true`
})

Methods

`get(path, defaultValue)`

Get the value stored in storage by method similar to lodash/get.

this.$localStorage.get('name', 'tom')
this.$localStorage.get('list.0.name', 'tom')

get('list.0.name', 'tom') that is equals:

const _list = this.$localStorage.get('list')
get(_list, '0.name', 'tom')

`set(path, value)`

this.$localStorage.set('name', 'tom')
this.$localStorage.set('list', [{ name: 'mary' }])

A key value of an object can be modified directly, but it should be guaranteed whether the object list.0 exists or not.

this.$localStorage.set('list.0.name', 'mary')

`remove(item)`

Delete a single key value based on the name.

this.$localStorage.remove('name')

`clear()`

The clear method does not clear all of the localStorage under the domain name, It is only clear that the value generated through the vue-localstorage2 (that is, the name of the stored value is the value pair that starts with the prefix + component name).

this.$localStorage.clear()