handle page title

pull/1/head
Evan You 4 years ago
parent 7bdde43f11
commit f3d1a98f95

@ -2,20 +2,15 @@ import { watchEffect } from 'vue'
import { siteDataRef } from './siteData' import { siteDataRef } from './siteData'
/** /**
* @param {import('./pageData').PageDataRef} pageData * @param {import('./pageData').PageDataRef} pageDataRef
*/ */
export function useUpdateHead(pageData) { export function useUpdateHead(pageDataRef) {
const descriptionTag = createHeadElement(['meta', { const descriptionTag = createHeadElement(['meta', {
name: 'description', name: 'description',
content: siteDataRef.value.description content: siteDataRef.value.description
}]) }])
document.head.appendChild(descriptionTag) document.head.appendChild(descriptionTag)
const updateTitleAndDescription = () => {
document.title = siteDataRef.value.title
descriptionTag.setAttribute('content', siteDataRef.value.description)
}
/** /**
* @type {HTMLElement[]} * @type {HTMLElement[]}
*/ */
@ -42,14 +37,15 @@ export function useUpdateHead(pageData) {
} }
watchEffect(() => { watchEffect(() => {
updateTitleAndDescription() const pageData = pageDataRef.value
updateHeadTags(siteHeadTags, siteDataRef.value.head) const siteData = siteDataRef.value
}) const pageTitle = pageData && pageData.title
document.title = (pageTitle ? pageTitle + ` | ` : ``) + siteData.title
watchEffect(() => { descriptionTag.setAttribute('content', siteData.description)
updateHeadTags(siteHeadTags, siteData.head)
updateHeadTags( updateHeadTags(
pageHeadTags, pageHeadTags,
pageData.value && pageData.value.frontmatter.head pageData && pageData.frontmatter.head
) )
}) })
} }

@ -28,7 +28,9 @@ export async function renderPage(
const html = ` const html = `
<html lang="en-US"> <html lang="en-US">
<head> <head>
<title>${config.site.title}</title> <title>${__pageData.title ? __pageData.title + ` | ` : ``}${
config.site.title
}</title>
<meta name="description" content="${config.site.description}"> <meta name="description" content="${config.site.description}">
<link rel="stylesheet" href="${assetPath}/style.css">${renderHead( <link rel="stylesheet" href="${assetPath}/style.css">${renderHead(
config.site.head config.site.head

Loading…
Cancel
Save