AlexxNB / tinro

Highly declarative, tiny, dependency free router for Svelte's web applications.
MIT License
675 stars 30 forks source link

can't navigate to routes manually #33

Closed zevaverbach closed 3 years ago

zevaverbach commented 3 years ago

Thanks for making this beautifully simple router -- I'm excited to start using it.

I'm probably misunderstanding something, but I expected to be able to navigate directly to a URL in the address bar if there exists a <Route /> for it. However, with the following code there are no reachable pages at all:

{#if user == null}
  <Route path="/" redirect="/login" />
  <Route path="/customers" redirect="/login" />
  <Route path="/admin" redirect="/login" />
  <Route path="/accounts" redirect="/login" />
  <Route path="/login"><Login /></Route>
{:else}
  <NavBar navTitle="RevTek">
    <span slot="leftNav">
        {#if user.admin }
          <a use:active href="/customers">Customers</a>
          <a use:active href="/admin">User Admin</a>
        {:else}
          <a use:active href="/accounts">Bank Accounts</a>
        {/if}
    </span>
    <span slot="rightNav">
      <button href="#" use:active on:click={logout} class="cursor-pointer {classNotActive}">Log Out</button>
    </span>
  </NavBar>
  {#if user.admin }
    <Route path="/" redirect="/customers" />
    <Route path="/customers"><Customers /></Route>
    <Route path="/admin"><Admin /></Route>
    <Route path="/accounts" redirect="/customers" />
    <Route path="/login" redirect="/customers" />
  {:else}
    <Route path="/" redirect="/customers" />
    <Route path="/customers" redirect="/accounts" />
    <Route path="/admin" redirect="/accounts" />
    <Route path="/accounts"><Accounts /></Route>
    <Route path="/login" redirect="/accounts" />
  {/if}
{/if}

I've gathered one piece of the puzzle, which is that if I add a <nav> with an anchor link to, say, /login, I can click that and the component which is associated with that route renders as expected. Is there any way to make routing work even when not clicking on a link?

zevaverbach commented 3 years ago

Sorry, here's the console output:

Uncaught (in promise) TypeError: Cannot read property 'pattern' of undefined
at Object.match (bundle.js:828)
at bundle.js:828
at Object.subscribe (bundle.js:772)
at i (bundle.js:828)
at instance (bundle.js:960)
at init (bundle.js:583)
at new Route (bundle.js:1015)
at Array.create_if_block$8 (bundle.js:28253)
at create_fragment$i (bundle.js:28989)
at init (bundle.js:598)
AlexxNB commented 3 years ago

Try to wrap all routes in <Route>...</Route>.
Hope I will fix it soon.

AlexxNB commented 3 years ago

For question about navigation - is it solution: https://github.com/AlexxNB/tinro/issues/27 ?

zevaverbach commented 3 years ago

@AlexxNB thanks for the quick response -- in fact, the solution in #27 does resolve this.