
Security News
NIST Under Federal Audit for NVD Processing Backlog and Delays
As vulnerability data bottlenecks grow, the federal government is formally investigating NIST’s handling of the National Vulnerability Database.
vue-web-storage
Advanced tools
A minimalistic Vue.js plugin for web storage
Vue.js version | Package version | Branch |
---|---|---|
2.x | 5.x | 5.x |
3.x | 6.x | master |
localStorage
or sessionStorage
or bothJSON.stringify
and JSON.parse
# yarn
yarn add vue-web-storage
# npm
npm install vue-web-storage
import {createApp} from 'vue';
import StoragePlugin from 'vue-web-storage';
const app = createApp({}).mount('#app')
app.use(StoragePlugin);
// Use as
// this.$localStorage
app.use(StoragePlugin, {
prefix: 'your_app_slug_',// default `app_`
drivers: ['session', 'local'], // default 'local'
});
// It will register two different instances
// this.$sessionStorage
// this.$localStorage
All methods take care of prefix
in key name, so you no need to specify the prefix when using them.
set(key,value)
Stores the value
under specified key
in storage. Convert value to JSON before saving.
This method throws error on failure.
this.$localStorage.set('name', 'john')
this.$localStorage.set('isAdmin', true)
this.$localStorage.set('roles', ['admin', 'sub-admin'])
this.$localStorage.set('permission', {id: 2, slug: 'edit_post'})
get(key, ?defaultValue = null)
Retrieves given key
value from storage, parse the value from JSON before returning.
If parsing failed then throws error.
this.$localStorage.get('name')
this.$localStorage.get('doesNotExistsInStorage','defaultValue')
remove(key)
Removes the individual key
from storage.
this.$localStorage.remove('name')
clear(?force = false)
Removes all keys from storage. Passing true
will clear whole storage without taking prefix
into consideration.
this.$localStorage.clear()
keys(?withPrefix = false)
Returns array of keys stored in storage. Passing true
will return prefixed key names.
this.$localStorage.keys()
hasKey(key)
Returns true
if key exists in storage regardless of its value.
this.$localStorage.hasKey('name')
length()
Returns the number of keys stored in storage.
this.$localStorage.length()
on(key,fn)
Attaches a listener method to the given key. You can attach multiple methods on the same key.
const onChangeName = (newValue, OldValue, originUrl) => {
// do something when `name` value gets changed
};
this.$localStorage.on('name', onChangeName);
this.$localStorage.on('name', this.anotherMethod)
off(key,fn)
Removes specified listener method form the given key.
this.$localStorage.off('name', this.onChangeName)
clearEvents(?key)
this.$localStorage.clearEvents('name');
this.$localStorage.clearEvents()
<!-- Vue js -->
<script src="https://cdn.jsdelivr.net/npm/vue@3"></script>
<!-- Lastly add this package -->
<script src="https://cdn.jsdelivr.net/npm/vue-web-storage@6"></script>
<!-- Init the plugin -->
<script>
yourApp.use(VueWebStorage.default)
</script>
__test__
folder.yarn test
Please see CHANGELOG for more information what has changed recently.
MIT License
Provide / inject
feature when using the Composition APIFAQs
Vue.js plugin for localStorage and sessionStorage
The npm package vue-web-storage receives a total of 675 weekly downloads. As such, vue-web-storage popularity was classified as not popular.
We found that vue-web-storage demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
As vulnerability data bottlenecks grow, the federal government is formally investigating NIST’s handling of the National Vulnerability Database.
Research
Security News
Socket’s Threat Research Team has uncovered 60 npm packages using post-install scripts to silently exfiltrate hostnames, IP addresses, DNS servers, and user directories to a Discord-controlled endpoint.
Security News
TypeScript Native Previews offers a 10x faster Go-based compiler, now available on npm for public testing with early editor and language support.