developing-with-turbo-frames
Turbo Frames do Laravel — częściowe aktualizacje stron bez przeładowania
Instalacja
Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.
Instalacja
O skillu
Skill do pracy z Turbo Frames w aplikacjach Laravel. Aktywuje się, gdy używasz komponentu x-turbo::frame, elementu turbo-frame, leniwego ładowania treści lub scoped navigation. Pomaga w budowaniu responsywnych interfejsów, gdzie kliknięcia linków i wysłanie formularzy aktualizują tylko wybraną część strony, a reszta pozostaje niezmieniona. Obsługuje morfowanie ramek, targetowanie data-turbo-frame i wykrywanie żądań z wasFromTurboFrame().
Jak używać
Zainstaluj skill w swoim projekcie Laravel z Hotwired. Skill automatycznie aktywuje się, gdy rozpozna komponent x-turbo::frame lub element turbo-frame w kodzie.
Otwórz plik Blade i użyj komponentu x-turbo::frame do opakowania sekcji strony, którą chcesz uczynić niezależną. Przekaż prop :id z modelem, stringiem lub tablicą [model, prefix], aby wygenerować unikatowy identyfikator ramki.
Umieść linki i formularze wewnątrz ramki. Domyślnie będą one targetować tę samą ramkę — kliknięcie lub wysłanie aktualizuje tylko tę sekcję, nie całą stronę.
Dla leniwego ładowania treści dodaj atrybut src do ramki, aby załadować zawartość na żądanie zamiast podczas renderowania strony.
Jeśli chcesz zmienić URL przeglądarki po aktualizacji ramki, użyj atrybutu data-turbo-action="advance" lub "replace" na linku lub formularzu wewnątrz ramki.
W kontrolerze Laravel użyj wasFromTurboFrame() do wykrycia, czy żądanie pochodzi z ramki, i zwróć odpowiednią odpowiedź zawierającą zaktualizowany element turbo-frame z tym samym id.