vue-localstorage2

Lightweight localStorage plugin 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

In Vue.js:

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

Vue.use(localStorage2)

In other framework, such as React:

import { Storage } from 'vue-localstorage2'

const storage = new Storage('app_name', 'app_prefix')
storage.set('item', 'value')
storage.get('item', 'default_value')

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()

License

Copyright (c) 2017-present, Army-U. Released under the MIT License.