Co nowego w Livewire v3 Laravel Framework?

Co nowego w Livewire v3 Laravel Framework?

Laravel Livewire to świetne narzędzie do uzyskania dynamicznego zachowania na stronie internetowej, bez bezpośredniego pisania kodu JavaScript. To sprawia, że ​​budowanie dynamicznych interfejsów jest proste, bez opuszczania komfortu Laravela. Ostatnio rdzeń Livewire został całkowicie przepisany.





jak zmodyfikować wii u

Nowy Livewire v3 ma lepsze różnice, funkcje można budować szybciej i jest mniej duplikacji między Livewire i Alpine, ponieważ bardziej opiera się na Alpine i używa swoich wtyczek Morph, History i innych. Kilka nowych funkcji było również możliwych dzięki przebudowie bazy kodu i położenie większego nacisku na Alpine.





MAKEUSEOF WIDEO DNIA

1. Wstrzykuj skrypty Livewire, style i Alpine automatycznie

Po zainstalowaniu przez kompozytora Livewire v2 musisz ręcznie dodać @livewireStyles, @livewireScripts i Alpine do swojego układu. Dzięki Livewire v3 wystarczy zainstalować Livewire, a wszystko, czego potrzebujesz, zostanie automatycznie wstrzyknięte - w tym Alpine!





<!DOCTYPE html> 
<html lang="en">
<head>
<script src="//unpkg.com/alpinejs" defer></script>
@livewireStyles @livewireScripts
</head>
<body>
...
</body>
</html>

2. Funkcje JavaScript w klasach PHP

Livewire v3 będzie wspierać pisanie funkcji JavaScript bezpośrednio w komponentach Livewire. Dodaj funkcję do swojego komponentu, dodaj komentarz /\*_ @js _/ nad funkcją, a następnie zwróć kod JavaScript przy użyciu składni PHP HEREDOC i wywołaj go ze swojego interfejsu użytkownika. Kod JavaScript zostanie wykonany bez wysyłania żądań do Twojego zaplecza.

<?php 
namespace App\Http\Livewire;
class Todos extends \Livewire\Component
{
/** @prop */
public $todos;
/** @js */
public function clear()
{
return <<<'JS'
this.todo = '';
JS;
}
}
?>
<div>
<input wire:model="todo" />
<button wire:click="clear">Clear</button>
</div>

3. Zablokowane właściwości

Livewire v3 obsługuje zablokowane właściwości — właściwości, których nie można zaktualizować z poziomu interfejsu użytkownika. Dodaj komentarz /\*\* @locked / nad właściwością swojego komponentu, a Livewire zgłosi wyjątek, jeśli ktoś spróbuje zaktualizować tę właściwość z interfejsu użytkownika.



<?php 
namespace App\Http\Livewire;
class Todos extends \Livewire\Component
{
/** @locked */
public $todos = [];
}
?>

4. Drut: model jest odroczony domyślnie

Ponieważ Livewire i jego użycie ewoluowały, zdaliśmy sobie sprawę, że zachowanie „odroczone” ma więcej sensu dla 95% formularzy, więc w wersji 3 funkcjonalność „odroczona” będzie domyślna. Pozwoli to zaoszczędzić na niepotrzebnych żądaniach wysyłanych do Twojego serwera i poprawi wydajność. Gdy potrzebujesz funkcji „na żywo” na wejściu, możesz użyć wire:model.live, aby włączyć tę funkcję.