Макрос Route::livewire

Макрос Route::livewire предназначен для регистрации полноэкранных компонентов Livewire. В отличие от обычного внедрения компонента в шаблон, этот макрос делает компонент главным содержимым всей страницы. В первый параметр передаётся путь URL, а во второй - имя класса компонента.

Синтаксис

<?php
	use LivewireLivewire;
	
	Route::livewire('/url', ComponentClass::class);
?>

Простой пример

Давайте зарегистрируем компонент Counter по пути /counter:

<?php
	use IlluminateSupportFacadesRoute;
	use LivewireLivewire;
	use AppLivewireCounter;
	
	Route::livewire('/counter', Counter::class);
?>

Теперь при переходе по адресу http://localhost/counter будет отображаться компонент Counter на всю страницу.

Пример с параметрами

Макрос позволяет передавать параметры в компонент через URL. Давайте создадим компонент, который принимает $id из сегмента URL:

<?php
	namespace AppLivewire;
	
	use LivewireComponent;
	
	class Article extends Component
	{
		public $id;
		
		public function mount($id)
		{
			$this->id = $id;
		}
		
		public function render()
		{
			return view('livewire.article');
		}
	}
?>

<?php
	use IlluminateSupportFacadesRoute;
	use LivewireLivewire;
	use AppLivewireArticle;
	
	Route::livewire('/article/{id}', Article::class);
?>

Теперь при переходе по адресу http://localhost/article/5 в свойство $id компонента будет передано значение 5.

Пример с несколькими параметрами

Можно передавать несколько параметров. Давайте создадим компонент, который принимает $category и $id:

<?php
	namespace AppLivewire;
	
	use LivewireComponent;
	
	class Product extends Component
	{
		public $category;
		public $id;
		
		public function mount($category, $id)
		{
			$this->category = $category;
			$this->id = $id;
		}
		
		public function render()
		{
			return view('livewire.product');
		}
	}
?>

<?php
	use IlluminateSupportFacadesRoute;
	use LivewireLivewire;
	use AppLivewireProduct;
	
	Route::livewire('/product/{category}/{id}', Product::class);
?>

При переходе по адресу http://localhost/product/electronics/10 в свойство $category попадёт electronics, а в $id - 10.

Ограничение параметров

Можно использовать стандартные ограничения Laravel для параметров с помощью метода where:

<?php
	use IlluminateSupportFacadesRoute;
	use LivewireLivewire;
	use AppLivewireArticle;
	
	Route::livewire('/article/{id}', Article::class)
		->where('id', '[0-9]+');
?>

Теперь параметр id может содержать только цифры. Если передать буквы, маршрут не будет найден.

Пример с именованными маршрутами

Макрос поддерживает создание именованных маршрутов с помощью метода name:

<?php
	use IlluminateSupportFacadesRoute;
	use LivewireLivewire;
	use AppLivewireCounter;
	
	Route::livewire('/counter', Counter::class)
		->name('counter.page');
?>

Теперь в Blade-шаблоне можно использовать именованный маршрут:

<a href="{{ route('counter.page') }}">
	Go to counter
</a>

Результат выполнения кода:

<a href="http://localhost/counter">
	Go to counter
</a>

Смотрите также

метод Livewire::component,
который регистрирует компонент для использования в шаблонах
метод render,
который возвращает шаблон компонента
метод mount,
который инициализирует компонент и принимает параметры из URL
статью полноэкранные компоненты,
которая подробно описывает работу с компонентами на всю страницу