在 Hooks / Sveltekit 中返回错误页面答案

【问题标题】：Returnning the error page in Hooks / Sveltekit在 Hooks / Sveltekit 中返回错误页面
【发布时间】：2022-08-11 22:29:37
【问题描述】：

文档对于显示 Hooks 的错误页面似乎有点含糊。我正在寻找一种有条件地显示 404 页面的方法。

export async function handle({ event, resolve }) {
  return new Response(\'This page does not exist.\', {status: 404})
}

这会以纯文本形式返回状态 404 页面，但我希望它返回带有布局的错误页面，而不仅仅是文本。有什么 API 可以使用吗？还是我应该重定向到 404 页面？

你有答案吗？
@LazNiko 我无法从文档中找到正确的解决方案，也无法从社区和网络中找到。如果请求无效，我只是最终重定向到 404 页面。 ex) return new Response(\'此页面不存在。\', {status: 302, headers: { Location: \'/404\' }})
明白了。那将是一个解决方案。谢谢你。

标签： sveltekit

【解决方案1】：

在您的路线文件夹中创建一个标题为 __error.svelte 的页面，这将在发生 404 之类的事情时显示这是一个404的例子

<script context="module">
    export function load({ error, status }) {
        return {
            props: {
                error: error,
                status: status
            }
        };
    }
</script>

<script>
    export let error;
    export let status;
</script>

<!--  -->
<svelte:head>
    <title>Something wrong | NameAuditor</title>
    <meta name="robots" content="noindex nofollow" />
    <html lang="en" />
</svelte:head>

<div class="flex h-screen justify-items-center">
    <!-- This file lives in public/404.html -->
    <div class="container m-auto px-4">
        <section class="py-8 px-4 text-center">
            <div class="max-w-auto mx-auto">
                <div class="md:max-w-lg mx-auto text-9xl font-bold">
                    {status}
                </div>
                <h2 class="mt-8 uppercase text-xl lg:text-5xl font-black">
                    We are sorry, Somthing went wrong!
                </h2>
                <p class="mt-6 uppercase text-sm lg:text-base">
                    {error.message}
                </p>
                <br />
                <a href="/" class="btn btn-primary">Back To Homepage</a>
            </div>
        </section>
    </div>
</div>

【讨论】：