Sapa 에서 사용할 간단한 라우터를 구현 했습니다.

jsx 문법을 가지고 sapa 에서 사용할 간단한 라우터를 구현 하고 있습니다.

생각보다 코드가 짧아서 이렇게 해도 되나 의심이 좀 가긴 하지만

실제 코드는 이게 끝이네요.

여기서 hashchange 나 popState 같은 이벤트 처리를 어떻게 할지만 정리하면 될 것 같습니다.

export class Route extends UIElement {}

export class Switch extends UIElement {}

export class Router extends UIElement {

template() {

return this.getLastRoute();

}

getLastRoute() {

const target = this.props.target;

const switchObject = this.findSwitch();

const route = switchObject.props.content.find((it) => {

return it.props.path === target;

});

return route.props.content[0];

}

findSwitch() {

return this.props.content.find((it) => it.Component === Switch);

}

}