我覺得vuex既然是狀態(tài)管理工具甥雕，那它的核心就是‘狀態(tài)’一詞踩身，vuex中定義的某個(gè)state變量可以理解成一個(gè)狀態(tài)，何為狀態(tài)社露？就是這個(gè)變量可以被vue的響應(yīng)式系統(tǒng)觀察到挟阻，當(dāng)它的值發(fā)生的變化的時(shí)候，頁面可以響應(yīng)到它的變化來主動(dòng)做一些事情峭弟，你甚至可以理解成是一個(gè)全局的data附鸽。
我們可以回想下，在vue組件中瞒瘸，定義在data中的某個(gè)變量坷备，如果這個(gè)變量被使用在html模板中，或者計(jì)算屬性中情臭，那么這個(gè)變量就是響應(yīng)式的省撑，當(dāng)這個(gè)變量變化時(shí)，那么html模板便會(huì)重新渲染俯在，計(jì)算屬性也會(huì)重新計(jì)算竟秫，理解這一點(diǎn)，我們?cè)賮砝斫鈜uex跷乐，首先肥败，上述的這個(gè)變量被定義在單組件中的data內(nèi)，也就是說只有在這個(gè)組件內(nèi)才能使用，可是在某些業(yè)務(wù)場景中馒稍，我們希望這個(gè)變量是覆蓋全局的皿哨，也就是在任何一個(gè)組件內(nèi)都能訪問到這個(gè)變量，并且最重要的是還可以讓它擁有響應(yīng)式的屬性纽谒，這個(gè)時(shí)候vuex這個(gè)工具就登場了往史，將這個(gè)變量定義在vuex中。
而localStorage中的數(shù)據(jù)只是一個(gè)靜態(tài)的值佛舱，無法被觀察。
- sessionStorage
sessionStorage 方法針對(duì)一個(gè) session 進(jìn)行數(shù)據(jù)存儲(chǔ)挨决。當(dāng)用戶關(guān)閉瀏覽器窗口后请祖，數(shù)據(jù)會(huì)被刪除。
儲(chǔ)存： 1. 點(diǎn)（.）運(yùn)算符 sessionStorage.age= '18';
2. 方括號(hào)（[ ]）運(yùn)算符 sessionStorage['age'] = '18';
3. localStorage.setItem sessionStorage.setItem("age", "18"); - localStorage
localStorage 方法存儲(chǔ)的數(shù)據(jù)沒有時(shí)間限制脖祈。第二天肆捕、一個(gè)月或明年之后，數(shù)據(jù)依然可用盖高。
儲(chǔ)存： 1. 點(diǎn)（.）運(yùn)算符 localStorage.age= '18';
2. 方括號(hào)（[ ]）運(yùn)算符 localStorage['age'] = '18';
3. localStorage.setItem localStorage.setItem("age", "18");
所以————
1.區(qū)別：vuex存儲(chǔ)在內(nèi)存慎陵，localstorage（本地存儲(chǔ)）則以文件的方式存儲(chǔ)在本地,永久保存；sessionstorage( 會(huì)話存儲(chǔ) ) ,臨時(shí)保存喻奥。localStorage和sessionStorage只能存儲(chǔ)字符串類型席纽，對(duì)于復(fù)雜的對(duì)象可以使用ECMAScript提供的JSON對(duì)象的stringify和parse來處理
2.應(yīng)用場景：vuex用于組件之間的傳值，localstorage撞蚕，sessionstorage則主要用于不同頁面之間的傳值润梯。
3.永久性：當(dāng)刷新頁面（這里的刷新頁面指的是 --> F5刷新,屬于清除內(nèi)存了）時(shí)vuex存儲(chǔ)的值會(huì)丟失，sessionstorage頁面關(guān)閉后就清除掉了甥厦，localstorage不會(huì)纺铭。
注：很多同學(xué)覺得用localstorage可以代替vuex, 對(duì)于不變的數(shù)據(jù)確實(shí)可以，但是當(dāng)兩個(gè)組件共用一個(gè)數(shù)據(jù)源（對(duì)象或數(shù)組）時(shí)刀疙，如果其中一個(gè)組件改變了該數(shù)據(jù)源舶赔，希望另一個(gè)組件響應(yīng)該變化時(shí)，localstorage谦秧，sessionstorage無法做到竟纳，原因就是區(qū)別1。
