alloc / saus

Vite SSR/SSG framework that aspires to be a layer for opinionated web frameworks to build upon
Other
38 stars 1 forks source link

Add `headProps` option to `route` declarations #44

Closed aleclarson closed 2 years ago

aleclarson commented 2 years ago

This option can be an object or a function that returns an object.

route('/books/:slug', () => import('../BookPage'), {
  headProps: async (_url, { slug }) => ({ 
    title: await titleForBookSlug(slug) 
  })
})

The headProps object will be passed to the renderer's head callback.

render(() => {
  return <div />
}).head((props, request) => {
  return <head><title>{props.title}</title></head>
})

This is useful for defining data that's only used to render the <head> element, and isn't needed for <body> hydration, so it won't be included in the [page].html.js module.

aleclarson commented 2 years ago

Added in next branch.

Note that the head method uses this signature:

.head(({ props, state, ...etc }) => {
  return '...'
})

…where props is what's resolved from the route.headProps call