Блог

я пробую библиотеку HTMX, и до сих пор она мне очень нравится. что-то, о чем я не могу до конца разобраться, — это обработка полной перезагрузки страницы.

Ссылки

 <a class="nav-link" href="#" hx-get="/api/?action=feed" hx-target="#app" hx-swap="innerHTML" hx-push-url="/#/feed">Feed</a>


<a class="nav-link" href="#" hx-get="/api/?action=profile" hx-target="#app" hx-swap="innerHTML" hx-push-url="/#/profile">Profile</a>
 

это довольно приятно тем, что он загружает содержимое в мой требуемый раздел и применяет ссылку /#/в моей строке URL и истории браузера.

Но когда я перезагружаю страницу по любому из URL-адресов /#/профиля или /#/ленты, страница перезагружается в состояние по умолчанию, не включая содержимое, указанное на страницах /#/профиля или /#/ленты.

Если я просто использую URL-адрес /профиля или /канала, я получу ошибку 404, как и ожидалось.

Все удивительно, я делаю что-то не так?

Для полной загрузки страницы вам потребуется либо:

1. Визуализация на стороне сервера содержимого
2. Используйте htmx с load триггером для загрузки содержимого при загрузке страницы. Вы можете найти пример этого здесь https://htmx.org/attributes/hx-trigger/

Во втором случае вам все равно нужно будет определить тип загружаемой страницы на стороне сервера, чтобы отобразить соответствующий div. Что-то вроде этого:

  <div hx-get="/api/?action=feed" hx-trigger="load" hx-target="#app" hx-swap="innerHTML"></div>