Home / Questions / 58142
Accepted
toledano
Asked: 2020-03-27 18:06:09 +0800 CST 2020-03-27 18:06:09 +0800 CST

获取承诺的价值

  • 772

我在获得承诺的价值时遇到了很多麻烦。基本上我希望将承诺的返回值分配给变量。例如

此示例使用以下元素：、almacen是 的同义词，localForage是用于本地存储的包。

使用此代码，我得到了错误Cannot read property 'getItem' of undefined

let _accessToken = this.almacen.getItem('token')

所以我使用一个函数.then()并得到上面相同的错误

let _accessToken = this.almacen.getItem('token').then(carga => carga)

所以我将我的变量转换_accessToken为一个函数。

let _accessToken = () => this.almacen.getItem('token').then((carga) => carga)

在这里，我没有任何语法错误，但评估时变量返回错误，即(error during evaluation).

现在，如果我创建一个函数并在里面使用 Promise，它就可以工作了。例如：

function _getAccessToken () {
  this.almacen.getItem('token')               // consulto el almacenamiento
    .then((payload) => {                      // obtengo el resultado
      if (payload) {
        this.$store.state.token = payload     // lo guardo en una variable global
        this.$store.state.fuera = false       // altero otra variable
      } else this.$store.state.fuera = true
    }).catch((e) => console.log(`Error ${e}`))
}

这里一切都按预期工作，但我坚持使用我的变量，所以我添加它：

let _accessToken = ''                            // declaro mi variable

function _getAccessToken () {
  this.almacen.getItem('token')
    .then((payload) => {
      if (payload) {
        _accessToken = payload                   // Aqui intento asignar la promesa
        this.$store.state.token = payload
        this.$store.state.fuera = false
      } else this.$store.state.fuera = true
    }).catch((e) => console.log(`Error ${e}`))
}

在评估函数时，我得到一个错误：
Uncaught TypeError: Cannot read property 'toString' of undefined.

事实是我只是在猜测，我无法正确理解。

如何将承诺的值保存在指示的变量中？

编辑

为了让您了解应用程序的工作原理，我创建了一个重现问题的小型 jsfiddle：

https://jsfiddle.net/jstoledano/hjawnnh2/1/

javascript

2 Answers

  1. Best Answer

    好的，所以我一直想学习如何使用 Vue.js，但我不认为我会从头开始，所以首先我不知道我在做什么关于可观察、计算和数据属性。如果解决方案很粗糙，我会提前道歉。

    我可以告诉你的是，要获得承诺的价值，你必须始终返回。那么它在哪里说：

    function _getAccessToken () {
  localforage.getItem('token')
    .then((payload) => {
      if (payload) {
        this.$store.state.token = payload
        this.$store.state.fuera = false
      } else this.$store.state.fuera = true
    }).catch((e) => console.log(`Error ${e}`))
}

    你没有返回任何东西。该函数总是分配一个未定义的值。

    相反，如果我说：

    function _getAccessToken () {
  return localforage.getItem('token')
    .then((payload) => {
      if (payload) {
        this.$store.state.token = payload
        this.$store.state.fuera = false
      } else {
        this.$store.state.fuera = true
      }
      return payload;
    }).catch((e) => console.log(`Error ${e}`))
}

    然后你可以说：

    var app = new Vue({
  el: '#app',
  store,
  mixins: [sessionService],
  computed: Vuex.mapState(['token', 'fuera']),
  mounted () {
    this.getAccessToken().then((token)=>{
        this.accessToken=token;
    })
  }
})

    它会在您的模板中看到。

    我留给你一个小提琴

    https://jsfiddle.net/3o69qjpz/

    但是，回到原来的小提琴，您似乎可以选择一个更短且可能很脏的解决方案，即通过执行以下操作直接this.accessToken在方法内部分配_getAccessToken：

    function _getAccessToken () {
  localforage.getItem('token')
    .then((payload) => {
      if (payload) {
        this.accessToken = payload     // <-- asignación directa
        this.$store.state.token = payload
        this.$store.state.fuera = false
      } else this.$store.state.fuera = true
    }).catch((e) => console.log(`Error ${e}`))
}

    这也是一样的。但我坚持认为，这不是使用Promise的方式，因为这个想法是_getAccessToken它可以用于任何其他用途并解析为令牌的价值。最后一种解决方法只是利用了副作用，我不会那样使用它。

    • 3

  2. Axios 也有同样的问题。我无法发送或接收 Axios 处理的任何数据，我在 Axios 内部看到了信息，但在外部无法使用它。

    我开始阅读有关 Promise 的内容并得出结论，这项技术总是首先评估操作的成功或失败。如果有错误，它永远不会通过del函数.then，如果成功，它会。

    它总是给我同样的错误

    无法读取未定义的属性“xxxx”

    这是因为从未配置分配或分配时尚未输入数据（异步）。通过将答案返回给另一个.then，可以确保获取数据。

    axios().then(response => {return response}.then{respuesta => { this.dato = respuesta}.catch{...}
    • 0