从 _layout 中排除页面 [英] Exclude a page from _layout

问题描述

您好，我是 Svelte、Sapper & 的新手快递.

问题:
我正在使用 Sappers _layout.html 来显示 2 个应该显示在所有页面上的组件(标题和菜单)，除了登录页面.

实现这一目标的正确方法是什么?

可能的解决方案:
A)从静态文件夹提供登录页面，并使用快速中间件路由到它?

B) 将登录作为我项目的根目录并将所有其他路由向下移动一个级别，以便它们可以共享不涉及登录页面的通用布局?

C) 在布局中放置和 if 语句并确定用户何时在登录页面上隐藏标题 &菜单组件.

D) 不使用布局来显示组件.

解决方案

我对这个问题的首选解决方案是选项 C — 使用 child.segment 来控制使用哪种布局:

{#if child.segment === '登录'}<svelte:component this={child.component} {...child.props}/>{:别的}<div class="fancy-layout"><svelte:component this={child.component} {...child.props}/>

{/如果}

Hello I am new to Svelte, Sapper & Express.

The problem:
I am using Sappers _layout.html to display 2 components (header & menu) that should be displayed on all pages, save for the login page.

What is the right way to achieve this ?

Possible solutions:
A) Serve the login page from the static folder, and use the express middleware to route to it?

B) Have the login as the root of my project and move all other routes down a level so they can share a common layout that dosnt involve the login page?

C) Put and if statement in the layout and determine when the user is on the login page to hide the header & menu components.

D) Not use the layout to display the components.

解决方案

My preferred solution to this problem is option C — using child.segment to control which layout is used:

<!-- src/routes/_layout.html -->
{#if child.segment === 'login'}
  <svelte:component this={child.component} {...child.props}/>
{:else}
  <div class="fancy-layout">
    <svelte:component this={child.component} {...child.props}/>
  </div>
{/if}

这篇关于从 _layout 中排除页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！