vue的緩存實現(xiàn)方式有哪些

這篇文章主要講解了“vue的緩存實現(xiàn)方式有哪些”，文中的講解內(nèi)容簡單清晰，易于學(xué)習(xí)與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學(xué)習(xí)“vue的緩存實現(xiàn)方式有哪些”吧！

vue實現(xiàn)緩存有4種方式：1、利用localStorage；2、利用sessionStorage；3、安裝并引用storage.js插件；4、利用vuex，它是一個專為Vue.js應(yīng)用程序開發(fā)的狀態(tài)管理模式

本教程操作環(huán)境：windows7系統(tǒng)、vue2.9.6版，DELL G3電腦。

vu中實現(xiàn)緩存的幾種方式：

前兩種

* localStorage

  window.localStorage.setItem(key,value)
  window.localStorage.getItem(key)

* sessionStorage

 window.sessionStorage.setItem(key,value)
  window.sessionStorage.getItem(key)

localStorage和sessionStorage區(qū)別

https://blog.csdn.net/qq_31741481/article/details/88054069

第三種（推薦）- storage.js

使用方式：

import storage from 'store'
// Store current user
store.set('user', { name:'Marcus' })

// Get current user
store.get('user')

// Remove current user
store.remove('user')

// Clear all keys
store.clearAll()

// Loop over all stored values
store.each(function(value, key) {
	console.log(key, '==', value)
})

測試得出，默認(rèn)存儲在localStorage中

store.js包含了各種存儲的解決方案，比如在某些localStorage失效的場景中，可以使用cookieStorage.js。掌握它，基本可以一網(wǎng)打盡緩存解決方案。

• all.js All the storages in one handy place.

• localStorage.js Store values in localStorage. Great for all modern browsers.

• sessionStorage.js Store values in sessionStorage.

• cookieStorage.js Store values in cookies. Useful for Safari Private mode.

• memoryStorage.js Store values in memory. Great fallback to ensure store functionality at all times.

• oldFF-globalStorage.js Store values in globalStorage. Only useful for legacy Firefox 3+.

• oldIE-userDataStorage.js Store values in userData. Only useful for legacy IE 6+.

更多介紹參考官方：store.js（https://github.com/marcuswestin/store.js#readme）

第四種 - vuex

適用構(gòu)建較為復(fù)雜的vue單頁應(yīng)用。

Vuex 是一個專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式。它采用集中式存儲管理應(yīng)用的所有組件的狀態(tài)，并以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測的方式發(fā)生變化。Vuex 也集成到 Vue 的官方調(diào)試工具 devtools extension，提供了諸如零配置的 time-travel 調(diào)試、狀態(tài)快照導(dǎo)入導(dǎo)出等高級調(diào)試功能。

感謝各位的閱讀，以上就是“vue的緩存實現(xiàn)方式有哪些”的內(nèi)容了，經(jīng)過本文的學(xué)習(xí)后，相信大家對vue的緩存實現(xiàn)方式有哪些這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關(guān)知識點的文章，歡迎關(guān)注！