useHead

原始檔
useHead 用於自定義 Nuxt 應用中單個頁面的頭部屬性。

useHead 可組合函式允許你以程式設計和響應式的方式管理你的頭部標籤，由Unhead提供支援。如果資料來自使用者或其他不可信來源，我們建議你檢視 useHeadSafe。

在文件 > 4 X > 入門 > Seo Meta中閱讀更多內容。

型別

簽名
export function useHead (meta: MaybeComputedRef<MetaObject>): void

以下是 useHead 的非響應式型別。

interface MetaObject {
  title?: string
  titleTemplate?: string | ((title?: string) => string)
  base?: Base
  link?: Link[]
  meta?: Meta[]
  style?: Style[]
  script?: Script[]
  noscript?: Noscript[]
  htmlAttrs?: HtmlAttributes
  bodyAttrs?: BodyAttributes
}

請參閱@unhead/vue獲取更詳細的型別。

useHead 的屬性可以是動態的，接受 ref、computed 和 reactive 屬性。meta 引數也可以接受一個返回物件的函式，以使整個物件具有響應性。

引數

meta

型別: MetaObject

一個接受以下頭部元資料的物件

  • meta: 陣列中的每個元素都對映到一個新建立的 <meta> 標籤，其中物件屬性對映到相應的屬性。
    • 型別: Array<Record<string, any>>
  • link: 陣列中的每個元素都對映到一個新建立的 <link> 標籤，其中物件屬性對映到相應的屬性。
    • 型別: Array<Record<string, any>>
  • style: 陣列中的每個元素都對映到一個新建立的 <style> 標籤，其中物件屬性對映到相應的屬性。
    • 型別: Array<Record<string, any>>
  • script: 陣列中的每個元素都對映到一個新建立的 <script> 標籤，其中物件屬性對映到相應的屬性。
    • 型別: Array<Record<string, any>>
  • noscript: 陣列中的每個元素都對映到一個新建立的 <noscript> 標籤，其中物件屬性對映到相應的屬性。
    • 型別: Array<Record<string, any>>
  • titleTemplate: 配置動態模板以自定義單個頁面上的頁面標題。
    • 型別: string | ((title: string) => string)
  • title: 在單個頁面上設定靜態頁面標題。
    • 型別: string
  • bodyAttrs: 設定 <body> 標籤的屬性。每個物件屬性都對映到相應的屬性。
    • 型別: Record<string, any>
  • htmlAttrs: 設定 <html> 標籤的屬性。每個物件屬性都對映到相應的屬性。
    • 型別: Record<string, any>