Multi-pages with layout? about choo HOT 5 CLOSED

@hew oh, I nowadays usually do const html = choo.view to have parity with const css = require('sheetify') from sheetify

Using css and html as var names makes stuff pretty straight forward I've found ✨

from choo.

You can nest functions like this:

const app = choo()

app.router((route) => [
  route('/foo', common(fooView)),
  route('/bar', common(barView))
])

function common (mainView) {
  return function (params, state, send) {
    return html`
      <aside>sidebar content</aside>
      <main>${mainView(params, state, send)}</main>
    `
  }
}

function fooView (params, state, send) {
  return html`<div>foo</div>`
}

function barView (params, state, send) {
  return html`<div>bar</div>`
}

The morphdom algorithm should do the work to ensure these transitions happen as smooth as possible. Does this answer your question?

from choo.

@yoshuawuyts I think that should be view`` instead of html``.

from choo.

@yoshuawuyts That makes sense. 👍🏽

from choo.

I'm going to assume this solves your issue. Thanks for opening! ✨

from choo.