https://github.com/livewire/livewire/releases/tag/v4.0.0
Livewire 4.0がついにリリースされました。このリリースは、Livewireにとって大きな前進を意味し、強力な新機能、改善された開発者体験、そして動的なLaravelアプリケーションを構築するためのより堅固な基盤をもたらします。
コンポーネントクラス、テンプレート、スタイル、JavaScriptを1つのファイルに記述できます。また、すべてを1つのディレクトリにまとめるマルチファイル形式も利用可能です。新しいシングルファイル形式がデフォルトで、php artisan livewire:convertでいつでも形式を変換できます。
ルートを含むアプリケーション全体でコンポーネントを名前で参照できます。新しいRoute::livewire()マクロは、フルページコンポーネントルートを定義する一貫した方法を提供します。
Livewireにはpages::とlayouts::の名前空間がデフォルトで付属し、アプリケーションのニーズに応じてコンポーネントを整理するためのカスタム名前空間をサポートします。
テンプレートに直接<script>と<style>タグを追加できます。スタイルは自動的にコンポーネントにスコープされ、スクリプトはコンポーネントコンテキスト用のthisにアクセスできます。両方ともブラウザキャッシュを使用してネイティブの.js/.cssファイルとして提供されます。
ページの残りの部分から独立して更新される、コンポーネント内の分離された領域を作成できます。アイランドは遅延読み込み可能で、クロスコンポーネントターゲティング用に名前を付けることができ、無限スクロールパターンのためのコンテンツ追加をサポートします。computed propertiesと組み合わせると、アイランドはデータベースからレンダリングされたHTMLまでのクエリを最適化します。
完全なBladeコンポーネントの互換性を実現。子コンポーネントにコンテンツを注入しながらすべてをリアクティブに保ち、HTML属性をシームレスに転送します。
wire:sortを使用して、任意の要素グループをドラッグ可能でソート可能にし、スムーズなアニメーションを実現します。外部ライブラリは不要です。ドラッグハンドル、複数リスト、カスタムポジショニングロジックをサポートします。
wire:transitionディレクティブは、ブラウザのView Transitions APIを使用してハードウェアアクセラレーションによるアニメーションを追加します。ステップウィザードやカルーセルのトランジション方向を制御できます。
インターフェースを即座に感じさせるディレクティブで、すぐに更新します：
wire:show - CSSを使用して可視性を切り替えwire:text - テキストコンテンツを更新wire:bind - 任意のHTML属性をリアクティブにバインド$dirty - 未保存の変更を追跡ネットワークリクエストをトリガーする任意の要素に自動的にdata-loading属性が付与され、CSSから直接ローディング状態をスタイリングすることが簡単になります。
@placeholderディレクティブを使用して、置き換えるコンテンツのすぐ横にローディング状態を定義できます。別のプレースホルダービューは不要です。
JavaScriptにドロップする必要がある場合、Livewire 4はそこで対応します：
wire:ref - 要素に名前を付け、PHPまたはJavaScriptからターゲットにする#[Json] - JavaScriptに直接データを返す$jsアクション - クライアントサイドのみのアクションを実行その他、数十のバグ修正、パフォーマンス改善、品質向上が含まれています。
このリリースに貢献してくださったすべての方々に心から感謝します。コード、バグレポート、ドキュメント、コミュニティサポートを通じて貢献してくださった方々に感謝します。このリリースサイクルを通じてコア機能と修正に尽力してくださった方々に特別な感謝を申し上げます。