https://github.com/pinguinjkeke/vue-local-storage

Vue.js localStorage plugin with types support
https://github.com/pinguinjkeke/vue-local-storage

localstorage ssr vue vuejs vuejs2

Last synced: 2 days ago
JSON representation

Vue.js localStorage plugin with types support

• Host: GitHub
• URL: https://github.com/pinguinjkeke/vue-local-storage
• Owner: pinguinjkeke
• License: mit
• Created: 2016-09-03T11:06:14.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2023-01-03T20:39:42.000Z (about 2 years ago)
• Last Synced: 2024-10-29T15:19:01.280Z (3 months ago)
• Topics: localstorage, ssr, vue, vuejs, vuejs2
• Language: JavaScript
• Size: 1.97 MB
• Stars: 672
• Watchers: 13
• Forks: 61
• Open Issues: 30
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-vue - vue-local-storage - local-storage?style=social) - 具有类型支持的Vuejs本地储存插件 (实用库)
• awesome-web-storage - vue-local-storage - Vue.js localStorage plugin with types support. (awesome-web-storage [](https://github.com/sindresorhus/awesome) / Different Storage APIs)
• awesome-github-vue - vue-local-storage - 具有类型支持的Vuejs本地储存插件 (实用库)
• awesome-github-vue - vue-local-storage - 具有类型支持的Vuejs本地储存插件 (实用库)
• awesome - vue-local-storage - 具有类型支持的Vuejs本地储存插件 (实用库)

README

        
# VueLocalStorage

[![CircleCI status](https://circleci.com/gh/pinguinjkeke/vue-local-storage/tree/master.svg?style=shield)](https://circleci.com/gh/pinguinjkeke/vue-local-storage/tree/master.svg?style=shield)

[![npm version](https://img.shields.io/npm/v/vue-localstorage.svg)](https://www.npmjs.com/package/vue-localstorage)

[![npm downloads](https://img.shields.io/npm/dt/vue-localstorage.svg)](https://www.npmjs.com/package/vue-localstorage)

LocalStorage plugin inspired by Vue typed props which take a care of typecasting for Vue.js 1 and 2 with SSR support.

## Install

  ``` bash

  npm install vue-localstorage --save

  ```

  or

  ``` bash

  bower install vue-localstorage

  ```

## Usage

  ``` js

  import VueLocalStorage from 'vue-localstorage'

  Vue.use(VueLocalStorage)

  // Or you can specify any other name and use it via this.$ls, this.$whatEverYouWant

  Vue.use(VueLocalStorage, {

    name: 'ls',

    bind: true //created computed members from your variable declarations

  })

  // Use localStorage from Vue object

  Vue.localStorage.set('someNumber', 123)

  Vue.localStorage.get('someNumber')

  // Fallback value if nothing found in localStorage

  Vue.localStorage.get('propertyThatNotExists', 'fallbackValue') // Will return 'fallbackValue' string

  

  // Default type if value isn't registered in localStorage section

  Vue.localStorage.get('property', null, Number)

  //register localStorage variables and adds computed variables to local components

  //to be used like regular computeds that are stored in the localstorage

  var vm = new Vue({

    localStorage: {

      someObject: {

        type: Object,

        default: {

          hello: 'world'

        }

      },

      someNumber: {

        type: Number,

      },

      someBoolean: {

        type: Boolean

      },

      stringOne: '',

      stringTwo: {

        type: String,

        default: 'helloworld!'

      },

      stringThree: {

        default: 'hello'

      }

    },

    methods: {

      someMethod () {

        let lsValue = this.$localStorage.get('someObject')

        this.$localStorage.set('someBoolean', true)

        this.$localStorage.remove('stringOne')

      }

    }

  })

  ```

## License

[MIT](https://github.com/pinguinjkeke/vue-local-storage/blob/master/LICENSE)