Async Routes

The router works great with asynchronous functions out of the box:

const routes = [
  {
    path: '/hello/:username',
    async action({ params }) {
      const resp = await window.fetch(`/api/users/${params.username}`)
      const user = await resp.json()
      if (user) return `<hello-page user="${user.displayName}"></hello-page>`
      return 'hello-page'
    },
  }
]

const router = createRouter(routes, '#router-outlet')

Alternatively, stick to Promises:

const routes = [
  {
    path: '/hello/:username',
    action ({ params }) {
      return window.fetch(`/api/users/${params.username}`)
        .then(resp => resp.json())
        .then(user => user ? `<hello-page user="${user.displayName}"></hello-page>` : 'hello-page')
    }
  }
]

const router = createRouter(routes, '#router-outlet')