如何将默认的“数据”值初始化为回调函数的返回值？

【问题标题】：How do I initialize a default "data" value to the returned value of a callback function?如何将默认的“数据”值初始化为回调函数的返回值？
【发布时间】：2019-06-12 16:21:03
【问题描述】：

当函数是异步的时，我遇到了一个问题，能够将 App.vue 上的值初始化为函数的结果。我还尝试将其设置为承诺的解决方案，但这似乎也不起作用。在前一种情况下，我只得到一个未定义的值，而在第二种情况下，我只得到一个 js 承诺的 ref 类型。在 Vue 中，将变量初始化为稍后将完成的回调结果的正确方法是什么？

【问题讨论】：

请分享您的代码，以便更清楚地看到问题
你能展示一下你做了什么吗？

标签： javascript vue.js vuejs2 promise es6-promise

【解决方案1】：

我更喜欢在created lifecycle hook 中执行此操作。异步操作完成后，结果将存储在 data 属性中。

new Vue({
  el: "#app",
  data: {
    asyncData: null
  },
  created() {
    const url = 'https://jsonplaceholder.typicode.com/posts/1';
    axios.get(url).then(response => {
        this.asyncData = response.data;
    });
  }
})

模板：

<div id="app">
    {{ asyncData }}
</div>

Here is a fiddle

【讨论】：