_layout.svelte 如何知道它是否在错误页面中？答案

【问题标题】：How does _layout.svelte know if it's in the error page?_layout.svelte 如何知道它是否在错误页面中？
【发布时间】：2020-02-16 04:10:28
【问题描述】：

_layout.svelte 中的 segment 变量对于主页和错误页面都是 undefined。我想为这些页面以不同的方式呈现页面，但在_layout.svelte 中找不到方法。

【问题讨论】：

_error.svelte 页面是否可以为错误呈现不同的页面？
对不起，没有。 _layout.svelte 中不同的部分

标签： svelte sapper

【解决方案1】：

由于Sapper 0.28.9 可以在_layout.svelte 中使用$page.error：

<script>
  import { stores } from '@sapper/app';
  const { page } = stores();
</script>

{#if !$page.error}
  <!-- error pages sit outside of the default layout-->
  <slot />
{:else}
  <fancy-layout>
    <slot />
  </fancy-layout>
{/if}

【讨论】：

【解决方案2】：

从版本 Sapper 0.27.9 开始，这是不可能的。

但是，有一个解决方法。

进入你的项目，在这个路径下编辑文件

[project-name]/node_modules/sapper/runtime/app.mjs

转到handle_error 函数，查找const props = {...

将segments: preloaded key:value 更改为segments: ['_error']

现在转到hydrate_target 函数

将const segments = page.path.split('/').filter(Boolean); 更改为

const segments = page.path === '/' ? ['index'] : page.path.split('/').filter(Boolean);

完成此操作后，使用 npm run dev 启动您的应用程序，segment 现在应该是 _error 或 index 而不是 undefined，具体取决于您所在的页面。

【讨论】：