vuex 数据存储本地
时间: 2023-11-08 22:05:59 浏览: 94
数据本地存储
可以使用浏览器的 localStorage 或 sessionStorage 将 Vuex 数据存储在本地。在 Vuex 中,可以通过订阅 store 的 mutation 来实现数据的自动存储和读取。
具体实现步骤如下:
1. 在 store 中定义一个 mutation,用于将 state 存储到本地存储中。
```
mutations: {
saveState(state) {
localStorage.setItem('state', JSON.stringify(state))
}
}
```
2. 在 store 的构造函数中,读取本地存储中的 state,并将其作为初始状态。
```
const state = JSON.parse(localStorage.getItem('state')) || initialState
```
3. 在 store 中订阅 mutation,每次 mutation 执行后自动将 state 存储到本地存储中。
```
store.subscribe((mutation, state) => {
localStorage.setItem('state', JSON.stringify(state))
})
```
阅读全文