Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

The method of vue local storage

2025-01-17 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)05/31 Report--

This article mainly introduces "the method of local storage of vue". In the daily operation, I believe that many people have doubts about the method of local storage of vue. The editor consulted all kinds of data and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts of "method of local storage of vue"! Next, please follow the editor to study!

Vue plug-in for using local Storage, session Storage, and memory Storage from the Vue context

A local storage method encapsulated by vue.

Install Npmnpm install vue-ls-saveYarnyarn add vue-ls uses

Vue-ls Storage API

Import Storage from 'vue-ls'; options = {namespace:' vuejs__', / / key key prefix name: 'ls', / / name Vue variable. [ls] or this. [$ls], storage:' local', / / Storage name: session, local, memory}; Vue.use (Storage, options); / or Vue.use (Storage) New Vue ({el:'# app', mounted: function () {Vue.ls.set ('foo',' boo'); / / set validity period Vue.ls.set ('foo',' boo', 60 * 60 * 1000); / / valid 1 hour Vue.ls.get ('foo'); Vue.ls.get (' boo', 10) / / if boo is not set, return the default value of 10 let callback = (val, oldVal, uri) = > {console.log ('localStorage change', val) } Vue.ls.on ('foo', callback) / / detect changes the Foo key and triggers callback Vue.ls.off (' foo', callback) / / No detection Vue.ls.remove ('foo'); / / remove}}); Global (global)

Vue.ls

Context (context)

This.$ls

API description Vue.ls.get (name, def)

Returns the name value in storage. Parse the values in the JSON internally before returning

Def: default null, if set, returns name.

Vue.ls.set (name, value, expire)

Set the value of name in storage. And convert value to JSON

Expire: defaults to null. The valid time of name is in milliseconds.

Vue.ls.remove (name)

Remove name from storage. True was removed successfully, otherwise false.

Vue.ls.clear ()

Clear storage.

Vue.ls.on (name, callback)

Continuously monitor name for changes on other tags, trigger callback when changes are made, and pass the following parameters:

NewValue: name in the current storage, parsed from persistent JSON

OldValue: name in the old storage, parsed from the persisted JSON

Url: modifying URL from tab

Vue.ls.off (name, callback)

Delete the previous listener Vue.ls.on (name, callback)

Vue-ls introduction

Vue plugin for work with local storage, session storage and memory storage from Vue context.

The Vue plug-in for using localStorage,sessionStorage and memory Storage from the Vue context.

At this point, the study of "vue local storage method" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report