Question

我正在尝试从localforage拨打axios来获取值，但它无效。

axios.get('https://api.example.org/api/?uname=' + this.$getItem('LSuname'), {
  withCredentials: true,
  headers: {'Authorization': 'Bearer ' + this.$getItem('LSmytoken')}
})

我在控制台中收到403错误：

XHR加载失败：GET＆＃34; https://api.example.org/api/?uname=[object%20Promise]＆＃34;。

我也尝试了this.$getItem('LSuname').then(value => { return value })和this.$getItem('LSuname').then(function (value) { return value })，但我得到了同样精确的403和错误的网址，最后有了承诺

我可以在我的vue中正确地返回值而不会出现问题：

this.$getItem('LSuname').then(value => {
  console.log('uname:' + value)
})

Answer 1

看起来this.$getItem是一个异步调用，它将返回Promise。这意味着您必须等待该调用完成后再调用任何依赖于这些异步调用的返回值的代码。

在您的情况下，您可以使用Promise.all()等待所有异步调用返回，然后再进行axios.get调用：

let unamePromise = this.$getItem('LSuname');
let mytokenPromise = this.$getItem('LSmytoken');

Promise.all([unamePromise, mytokenPromise]).then((vals) => {
  axios.get('https://api.example.org/api/?uname=' + vals[0], {
    withCredentials: true,
    headers: {'Authorization': 'Bearer ' + vals[1] }
  })
})

Vue.js Axios从本地存储（localforage）获取值返回promise对象而不是value

1 个答案: