コンテンツにスキップ
SvelteMetaTags
日本語
Esc
navigateopen⌘Jpreview
このページの内容

Additional Meta Tags

このライブラリでカバーしていない他のメタタグを追加できます。

content が必要です。次に、nameproperty、または httpEquiv のいずれかが必要です (それぞれ 1 つのみ)

httpEquivhttpEquiv としてではなく、HTML属性 http-equiv としてレンダリングされます。これは additionalMetaTags のフィールド名の中で、属性名と1対1で対応しない唯一の項目です。

additionalMetaTags={[
  {
    property: 'dc:creator',
    content: 'Jane Doe'
  },
  {
    name: 'application-name',
    content: 'Svelte-Meta-Tags'
  },
  {
    httpEquiv: 'x-ua-compatible',
    content: 'IE=edge; chrome=1'
  }
]}

無効な例

これらは、同じエントリに namepropertyhttpEquiv が複数含まれているため無効です。

additionalMetaTags={[
  {
    property: 'dc:creator',
    name: 'dc:creator',
    content: 'Jane Doe'
  },
  {
    property: 'application-name',
    httpEquiv: 'application-name',
    content: 'Svelte-Meta-Tags'
  }
]}

タグの重複

additionalMetaTags の各エントリは、それぞれ独立した <meta> タグとしてレンダリングされます。重複排除は行われません。同じ name / property / httpEquiv を持つ 2 つのエントリを渡すと、両方がレンダリングされます:

additionalMetaTags={[
  {
    property: 'dc:creator',
    content: 'John Doe'
  },
  {
    property: 'dc:creator',
    content: 'Jane Doe'
  }
]}

レンダリングされる結果:

<meta property="dc:creator" content="John Doe" /> <meta property="dc:creator" content="Jane Doe" />

deepMerge でベースとページのメタタグを結合する場合、配列は連結ではなく置換されます。つまりページ側の additionalMetaTags はレイアウト側のものを丸ごと置き換えるため、両階層を結合したときに生じる重複は避けられます。ただし同一の additionalMetaTags 配列内の重複までは解消されないため、配列を書く際にご自身で避ける必要があります。

このページは役に立ちましたか?