将数据从 Electron-Vue 应用程序中的 axios 响应直接保存到 localStorage答案

【问题标题】：Saving data directly to the localStorage from axios response in Electron-Vue application将数据从 Electron-Vue 应用程序中的 axios 响应直接保存到 localStorage
【发布时间】：2019-01-18 07:20:24
【问题描述】：

我正在尝试将一些数据保存到 Electron 应用程序中的 localStorage，基于 Vue.js，使用这样的 axios：

mounted () {
    axios.get(myURLhere).then(response => {
        let data = response.data
        data[anotherThing] = someElseDataHere
        this.localStorage['data'] = JSON.stringify(data)
    })
}

在“then”-block 中的数据变量是正确的。但是在 localStorage data = some empty Observer object！

我做错了什么？ “then”-block 是否不足以等到数据存储在 localStorage 中？在这种情况下，我如何在我的代码中等待它？

【问题讨论】：

localStorage 是一个全局对象。您是否有目的地定义了 Vue 的 localStorage 属性（您正在使用 this.localStorage）？
是的，我做到了。 LocalStorage (this.localStorage) 效果很好。问题出在 axios 处理 fetch 请求中。因为 localStorage 在其他情况下工作正常。
如果你想直接保存到localStorage，使用window.localStorage，而不是this.localStorage。要么？我错过了什么吗？
我认为没有区别...因为与本地存储的所有其他操作都可以。我通过“this”与 localStorage 进行所有交互。它有效。在这种情况下，它也可以工作。但不正确。因为该值不为空，所以它是一个观察者类型的对象。但是观察者是空的。这意味着在 Observer 之前处理的代码将从服务器获取数据。 LocalStorage 将 Observer 作为一个值。但是我需要存储一个带有响应数据的对象，而不是空的 Promise，它仍在等待响应。

标签： vue.js local-storage electron axios

【解决方案1】：

我使用 vue-localStorage。由于某种原因，它没有正确进行数组到字符串的转换：

this.$localStorage.set('data', data) // data will be not an Array, but an Observer instance

这就是我正确存储对象实例但数组出错的原因。因此，要修复它，您需要直接使用 localStorage，如下所示：

localStorage['data'] = JSON.stringify(data)

告诉我检查 localStorage 的人部分正确 - 问题出在 localStorage 中。

【讨论】：