Суффикс заголовка стройной головы

Question

Я хочу добавить суффикс заголовка заголовка, например - mywebsite, на каждую страницу Svelte.

Я изо всех сил пытаюсь найти способ сделать это легко и просто.

На веб-сайте Svelteисточник, мы можем видеть, что они делают это вручную: https://github.com/sveltejs/svelte/blob/1273f978084aaf4d7c697b2fb456314839c3c90d/site/src/routes/docs/index.svelte#L15

Я начал создавать такой компонент:

<script>
  export let title = false;
</script>

<svelte:head>
  <title>
    {#if title}
      {title} • WebSite
    {:else}
      Website • Home suffix
    {/if}
  </title>
</svelte:head>

Но:

• У меня есть<title> can only contain text and {tags}svelte(illegal-structure) ошибка
• Я не уверен, что это самый простой способ.

Как добиться того, что я хочу сделать?

Answer 1

Хотя использование троичного внутри разметки работает просто отлично, операторы реактивности могут помочь очистить его:

<script>
  export let title = false;

  $: fullTitle = title 
        ? `${title} • WebSite` 
        : 'Website • Home suffix';
</script>

<svelte:head>
  <title>{fullTitle}</title>
</svelte:head>

Answer 2

Поскольку <title> может содержать только текст или {tags}, можно вычислить заголовок документа с помощью троичного оператора.

Пример

<script>
  export let title = false;
</script>

<svelte:head>
  <title>{title ? `${title} • WebSite` : 'Website • Home suffix'}</title>
</svelte:head>