vue3 script setup下axios请求页面为空白

最新推荐文章于 2024-09-27 21:05:27 发布

红雾i

最新推荐文章于 2024-09-27 21:05:27 发布

阅读量2.5k

点赞数 1

分类专栏：笔记

原文链接：https://blog.csdn.net/WangYC_/article/details/115730233

版权

笔记专栏收录该内容

5 篇文章 0 订阅

订阅专栏

解决方法

在Vue3中，如果当前组件的setup使用了async/await，那么其调用组件的父组件的外层需要嵌套一个suspense标签，

原文地址

代码

//父组件app.vue
<template>
  <img alt="Vue logo" src="./assets/logo.png" />
  <suspense>
    <HelloWorld msg="Hello Vue 3 + TypeScript + Vite" />
  </suspense>
</template>
......





//helloworld.vue
<template>
  {{ result.data.id }}
</template>

<script setup lang="ts">
import axios from "axios";
interface result {
  id: Number;
}
const result = await axios.get<result>("/test");
</script>