如何使用 Nuxt.js 在 vuex 状态中获取本地存储数据
How to get localstorage data inside vuex state with Nuxt.js
我正在使用 Nuxt 构建购物车。但是当我刷新页面时，购物篮会自动清空。
我尝试像 vuex-persist , vuex-persistedstate 这样的库...
但我没有解决方案。
现在我正在寻找一种直接从本地存储中获取购物车初始状态的方法。
state: {
cart: [] //here what i want => window.localStorage.getItem("cart")
}
非常感谢。
您只能在浏览器中访问localStorage。它在 SSR 期间不可访问。
所以你需要在 vuex store 中创建一个 mutation 来做你想做的事并在 mounted 钩子中提交它（mounted 只在浏览器中执行）。
例如
...
mounted() {
this.$store.commit('myMutation', window.localStorage.getItem("cart")
}
使用 nuxt-vuex-localstorage
它运行良好并与 vuex
同步
我正在使用 Nuxt 构建购物车。但是当我刷新页面时，购物篮会自动清空。
我尝试像 vuex-persist , vuex-persistedstate 这样的库... 但我没有解决方案。
现在我正在寻找一种直接从本地存储中获取购物车初始状态的方法。
state: {
cart: [] //here what i want => window.localStorage.getItem("cart")
}
非常感谢。
您只能在浏览器中访问localStorage。它在 SSR 期间不可访问。 所以你需要在 vuex store 中创建一个 mutation 来做你想做的事并在 mounted 钩子中提交它（mounted 只在浏览器中执行）。
例如
...
mounted() {
this.$store.commit('myMutation', window.localStorage.getItem("cart")
}
使用 nuxt-vuex-localstorage 它运行良好并与 vuex
同步