Создание фреймворка для SPA на чистом JavaScript. Урок 4. Роутинг

Премиум уроки по веб-разработке:

В этом уроке мы с вами сделаем доступный api для внедрения роутов в наше spa приложение.

В этом уроке мы сделаем возможность нашего spa приложения по переключению различных страниц в зависимости от текущего роута. Навигацию мы будем осуществлять через хеш, для того, чтобы страницы переключались без перезагрузки страницы.

[cleverdeveloper]

Для тех, у кого не работает, попробуйте поставить false третьим параметром:
window.addEventListener("hashchange", function(){

},
false);

[АлексейБобриков-пр]

Если кто-то из 2023, есть одно улучшение, которое позволит добавлять бесконечно много одинаковых компонентов и не париться по поводу порядка компонентов и их вложенности друг в друга

export class Module {
initComponents() {
while (this.components.some(c => c.render())) {}
}
}

export class Component {
render() {
const el =
if (!el) return false;

el.insertAdjacentHTML('beforebegin', this.template);
el.remove();
return true;
}
}

[TitovAndrei]

Почему может ошибка выдавать на 'render'? После 19:50 - до этого всё нормально.

Uncaught (in promise) TypeError: c.render is not a function
at (index.js_+_12_modules:56)
at (index.js_+_12_modules:53)
at (index.js_+_12_modules:47)
at app_module_AppModule.start (index.js_+_12_modules:39)
at bootstrap (index.js_+_12_modules:5)
at wfm.delay.then (index.js_+_12_modules:198)

[ВиталийМашанов-еч]

хммм... Не понимаю, почему у меня не работает

initRoutes(){
window.addEventListener("hashchange", () => {

})
}