1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/examples/with-react-helmet/pages/_document.js

46 lines
1.2 KiB
JavaScript
Raw Normal View History

import Document, { Head, Main, NextScript } from 'next/document'
import Helmet from 'react-helmet'
export default class extends Document {
static async getInitialProps ({ renderPage }) {
// see https://github.com/nfl/react-helmet#server-usage for more information
// 'head' was occupied by 'renderPage().head', we cannot use it
return { ...renderPage(), helmet: Helmet.rewind() }
}
// should render on <html>
get helmetHtmlAttrComponents () {
return this.props.helmet.htmlAttributes.toComponent()
}
// should render on <head>
get helmetHeadComponents () {
return Object.keys(this.props.helmet)
.filter(el => el !== 'htmlAttributes') // remove htmlAttributes which is not for <head> but for <html>
.map(el => this.props.helmet[el].toComponent())
}
get helmetJsx () {
return (<Helmet
htmlAttributes={{lang: 'en'}}
title='Hello next.js!'
meta={[
{ name: 'viewport', content: 'width=device-width, initial-scale=1' }
]}
/>)
}
render () {
return (<html {...this.helmetHtmlAttrComponents}>
<Head>
{ this.helmetJsx }
{ this.helmetHeadComponents }
</Head>
<body>
<Main />
<NextScript />
</body>
</html>)
}
}