Vue3 发生错误:setup function returned a promise

2022-10-15,,,,

当你组件中有 Promise 对象时,即 Axios、Ajax 这类的请求,然后把数据渲染到模板中就会报如下图的错误:

在这个异步组件外包裹一个 <Suspense> 组件。比如 App.vue 中使用了异步组件,异步组件又是个路由组件:

App.vue:

<div class="app">
<Suspense>
<router-view />
<template #fallback>
Loading...
</template>
</Suspense>
</div>

当异步组件正在请求数据时,此时页面会出现短暂的空白,而空白处可以用<template #fallback>来代替。

注意:<Suspense> 是一个实验性的特性,它的API可能会改变。

Vue3 发生错误setup function returned a promise的相关教程结束。

《Vue3 发生错误:setup function returned a promise.doc》

下载本文的Word格式文档,以方便收藏与打印。