區別：
vuex存儲在內存，localstorage（本地存儲）則以文件的方式存儲在本地,永久保存；sessionstorage( 會話存儲 ) ,臨時保存。localStorage和sessionStorage只能存儲字符串類型，對於復雜的對象可以使用ECMAScript提供的JSON對象的stringify和parse來處理
vuex用於組件之間的傳值，localstorage，sessionstorage則主要用於不同頁面之間的傳值。
永久性：
當刷新頁面（這里的刷新頁面指的是 --> F5刷新,屬於清除內存了）時vuex存儲的值會丟失，sessionstorage頁面關閉后就清除掉了，localstorage不會。
注：很多同學覺得用localstorage可以代替vuex, 對於不變的數據確實可以，但是當兩個組件共用一個數據源（對象或數組）時，如果其中一個組件改變了該數據源，希望另一個組件響應該變化時，localstorage，sessionstorage無法做到，原因就是區別1。
VueX的應用場景
1、組件會被銷毀
我們可以假設這樣一個場景：
假如有這樣一個組件，他是彈窗，有一些復選框和輸入框，用戶會選擇和填寫信息；
然后這個彈窗會被關閉和打開，由於業務需要，這個彈窗輸入的內容，希望關閉后可以保留，在重新打開后，內容依然存在。
解決方案：
我們可以考慮將值存在父組件中，也就是說，實際修改的是父組件的值； 存在比如 sessionStorage、cookies之類的里面，在 created 時從中讀取，destroyed的時候寫入其中； 可以存到 global-event-bus 里面；
最好的還是存在 Vuex 里：
可以直接通過 $store.state 來調用，通過 commit() 來修改值；
也可以在 created 的時候，讀取存在 state 里面的值，在 destroyed 的時候，寫回 state；
2、組件基於數據而創建
我們可以假設這樣一個場景：
用戶登錄后，讀取權限配置表，這顯然是一個異步操作； 這個配置表可能會影響很多頁面。比如被影響的組件的加載條件，例如是 v-if="$store.state.userInfo.superVIP；
那么：
因為讀取權限配置表這個異步操作，可能影響多個組件，而這些組件之間的關系，顯然是不可預料的（即不一定是在同一個父組件下面）；
那么這個異步操作，寫在某一個組件里就不太合適（因為其他組件讀取這個組件很不方便，即使他是根組件）；
解決辦法：
一個妥協的解決辦法，是寫在 global-event-bus 里面來實現； 但是顯然，更好的解決辦法是寫在 vuex 里面更專業一些；
3、多對多事件——多處觸發，影響多處
我們可以假設這樣一個場景：
假如有一個事件，比如：切換頁面顯示風格，他將改變某一個變量的值； 當該變量為 true 時，那么頁面風格為白天（主要影響 v-bind:style 的值）； 當該變量為 false 時，那么頁面風格為晚上（同上）； 在多個地方可以切換這個頁面風格開關； 毫無疑問，這個變量將影響多個地方的 v-bind:style 的值； 這就是 多對多 場景；
那么：
無論這個變量放在哪個組件里，其他組件調用他都是很麻煩的事情； 即使存於根組件，然后通過 this.$root.xx 來獲取這個變量，也是很麻煩的，而且很丑陋；
解決辦法：
如果不使用 Vuex，那么我們可能會去考慮使用 global-event-bus 來存儲這個變量，並使用它； 這不是不可以，但不優雅，而且管理麻煩； 而使用 Vuex，那么這就是一件很方便的事情了； 我們可以通過 $store.state.xxx 來獲取這個變量的值； 通過 $store.getters.yyy 來獲取某些基於這個值的，表示通用樣式（例如黑底白字）的對象； 通過 $store.commit() 來提交修改（比如在某些情況下可以禁止修改）； 甚至可以通過 $store.dispatch() 來獲取其他風格的樣式，並通過 $store.state 和 $store.getters 來返回新風格的樣式；
4、總結
總而言之，假如你需要 數據 和 組件 分離，分別處理，那么使用 Vuex 是非常合適的。
相反，如果不需要分離處理，那么不使用 Vuex 也沒關系。
比如某個數據只跟某組件打交道，是強耦合的。那么這個數據就應該存放在該組件的 data 屬性中。