我使用以下代码(简化)在Nuxt项目中创建自定义错误页面:
<script setup lang="ts">
const props = defineProps({
error: Error,
});
function onClearError() {
clearError({ redirect: "/" });
}
</script>
<template>
// ...
{{ props.error }}
// ...
</template>
问题是,Nuxt传递的“error”属性只包含错误信息,如“Error:页面未找到/bookmarks/errr”。
我想做的是得到错误代码,也是。例如404、500等。
在useError()的定义中:https://nuxt.com/docs/api/composables/use-error据说它返回statusCode
,但我就是找不到如何得到它。
1条答案
按热度按时间utugiqy61#
您不需要在模板中调用
prop
。您可以直接调用error
对象,如下所示。显示错误消息
确保在根目录中创建
error.vue
页。~error.vue
我为你创建了一个示例https://stackblitz.com/edit/nuxt-starter-bqwk4j?file=error.vue
第一个链接将呈现404未找到页面,因为应用程序上不存在
about
页面。而另一个,我手动抛出一个错误来呈现和错误的页面。希望这对你有帮助。如果您想了解更多关于错误处理的信息,可以在这里找到nuxt示例https://nuxt.com/docs/examples/app/error-handling