A、http请求

一、子组件

<template>
  <div >
      <img :src="result.message" alt="">
  </div>
</template>
<script >
import axios from 'axios';
export default {
  async setup() {
    const url = "https://dog.ceo/api/breeds/image/random";
    const res = await axios.get(url);
    console.log(res.data.message)
    return {
        result:res.data
    }
  },
};
</script>

二、父组件

<template>
  <div>
    <Suspense>
       <template #default>
          <dog-async></dog-async>
       </template>
       <template #fallback>
         <div>loading...</div>
       </template>
    </Suspense>
    <DogAsync></DogAsync>
  </div>
</template>
<script setup>
import DogAsync from './Children/DogAsync.vue'
</script>