phantom icon indicating copy to clipboard operation
phantom copied to clipboard

Add example to demonstrate a client routing pattern

Open sidiousvic opened this issue 4 years ago โ€ข 0 comments

This is a simple, declarative implementation of a routing mechanism that may or may not work well with phantom:

โš  Precludes that the index page is served by default to all routes.

function phantomComponent() {
  const route = window.location.pathname;
  switch (route) {
    case "/view1":
      return `${View1()}`;
    case "/view2":
      return `${View1()}`;
  }
}

function View1() {
  return `<div id="view-1">{...}</div>`;
}

function View2() {
  return `<div id="view-2">{...}</div>`;
}

Implement an example that demonstrates a pattern like such as the above.

Useful resources: Create a Modern Vanilla Javascript Router on HACKDOOR How to Build a Router With Vanilla JavaScript Implementing Simple SPA Routing Using Vanilla JavaScript

sidiousvic avatar Jul 02 '20 23:07 sidiousvic