Next.js:使用自定義標籤填充head標籤

如何自定義head您的Next.js應用程序的標籤

從任何Next.js頁面組件中,您都可以將信息添加到頁面標題中。

在以下情況下方便使用:

  • 您要自定義頁面標題
  • 您想更改一個元標記

你怎麼能這樣呢?

在每個組件中,您都可以導入Head組件來自next/head並將其包含在組件JSX輸出中:

import Head from 'next/head'

const House = props => ( <div> <Head> <title>The page title</title> </Head> {/* the rest of the JSX */} </div> )

export default House

您可以添加任何想要顯示在<head>頁面的部分。

在安裝組件時,Next.js將確保其中的標籤Head被添加到頁面的標題。與卸載組件相同,Next.js將負責刪除這些標記。

免費下載我的Next.js手冊


接下來的更多教程: