Vue3 中如何格式化展示 Get 请求返回的数据

<template>
  <div>
    <ul>
      <li v-for='item in data' :key='item.id'>
        {{ item.name }} - {{ item.age }}
      </li>
    </ul>
  </div>
</template>
<script>
import axios from 'axios';

export default {
  data() {
    return {
      data: []
    };
  },
  mounted() {
    axios.get('https://example.com/api/data')
      .then(response => {
        this.data = response.data;
      })
      .catch(error => {
        console.log(error);
      });
  }
};
</script>
<p>在上述示例中，首先在<code>data</code>中定义了一个空数组<code>data</code>，用于存储返回的数据。在<code>mounted</code>生命周期钩子中发送get请求，当请求成功时，将返回的数据赋值给<code>data</code>，然后在模板中使用<code>v-for</code>指令遍历<code>data</code>数组，将每个元素的<code>name</code>和<code>age</code>属性展示出来。</p>
<p>请注意，上述示例中使用了axios作为发送请求的工具，你也可以使用其他的请求工具，如fetch等。</p>