asyncData 请求的 数据如何赋值给vue Data

在 Vue 中，可以通过 `asyncData` 方法来异步获取数据。在 `asyncData` 方法中，可以通过返回一个对象来将获取到的数据赋值给组件的 `data` 属性。

举个例子，假设我们有一个组件 `MyComponent`，需要在 `asyncData` 中获取一些数据，并将其赋值给 `data`。可以这样写：

<template>
  <div>{{ message }}</div>
</template>

<script>
export default {
  data() {
    return {
      message: ''
    }
  },
  async asyncData() {
    const response = await fetch('https://example.com/data')
    const data = await response.json()

    return { message: data.message }
  }
}
</script>

在上面的代码中，我们首先定义了一个初始的 `data` 对象，其中 `message` 属性的值为空。然后，在 `asyncData` 方法中，我们使用 `fetch` 方法来异步获取数据，并将获取到的数据赋值给 `message` 属性。最后，`asyncData` 方法返回一个对象，该对象的属性名对应组件的 `data` 属性名，属性值即为获取到的数据。这样，Vue 就会自动将返回的对象中的属性值赋值给组件的 `data` 属性，从而更新视图。