What about nested routes?

[frederikhors]

What about nested pages?

E.g.:

1. Users Index (the list and the detail can change)

   1. Users Sidebar

   2. User Detail

      1. User Edit
      2. User Show

I hope I explained myself.

[zyxd]

If I understood the question correctly, it can be solved using the loose parameter of Match component or match function (now in >= v1.0.21). Details about loose parameter.

Example using Match component:

<Matcher>
  <Match path={$route.path} pattern="/users" loose>
    <Sidebar/>
    <Matcher>
      <Match path={$route.path} pattern="/users">
        Users list
      </Match>
      <Match path={$route.path} pattern="/users/:id" let:params={{ id }}>
        User {id} profile
      </Match>
      <Match path={$route.path} pattern="/users/:id/edit" let:params={{ id }}>
        User {id} edit
      </Match>
    </Matcher>
  </Match>
  <Match path={$route.path}>
    Page not found
  </Match>
</Matcher>

Or using match function:

{#if match('/users', $route.path, true)}
  <Sidebar/>
  {#if match('/users', $route.path)}
    Users list
  {:else if params = match('/users/:id', $route.path)}
    User {params.id} profile
  {:else if params = match('/users/:id/edit', $route.path)}
    User {params.id} edit
  {/if}
{:else}
  Page not found
{/if}

[frederikhors]

I think we need docs on this.

[frederikhors]

What do you think about putting it in your amazing demo?

[zyxd]

What do you think about putting it in your amazing demo?

I'll think about it. Also, a PR would be appreciated.

[zyxd]

I think we need docs on this.

I added something to the README.