Я пытаюсь реализовать маршрутизацию на стороне клиента для моего SPA. Я знаю, что есть библиотеки типа page. js, чтобы помочь с этим, но я хочу реализовать это сам, чтобы я мог узнать, как это работает. Кажется, у меня это работает, но это было намного проще, чем я думал, поэтому я волнуюсь, что что-то пропустил. Я предпринял следующие шаги:
- Я установил, чтобы мой сервер всегда возвращал
index.html. index.html содержит ссылки, например <a href="/home"></a> на каждую страницу. - при начальной загрузке страницы, получите URL-адрес из
window.location.pathname и отобразите правильную страницу. - добавить обработчик кликов для каждой ссылки, которая:
event.preventDefault(), добавить страницу в историю с помощью window.history.pushState(), а затем, наконец, отобразить соответствующую страницу. - прослушать событие
popstate и отображать связанную страницу, обрабатывать кнопки браузера назад и вперед.
Итак, у меня начальная загрузка страницы / refre sh, которая правильно отображает любой URL в адресной строке, а также навигацию назад и вперед кнопки работают благодаря pushState() и popstate слушателю. Я что-то пропустил? Почему люди используют # URL, когда кажется, что просто предотвратить перезагрузку страницы с помощью event.preventDefault()? Спасибо!