Метод component
Метод component класса Livewire позволяет динамически создавать экземпляры компонентов Livewire в PHP-коде. Он принимает имя компонента и параметры, возвращает объект компонента. Это полезно для программного создания компонентов в контроллерах, других компонентах или сервисных классах.
Метод имеет следующий синтаксис:
<?php
Livewire::component('component-name', ['param' => 'value'])
?>
Синтаксис
<?php
Livewire::component('component-name', ['param' => 'value'])
?>
Параметры метода:
-
string $name- имя компонента в формате 'folder.component' -
array $params- массив параметров, передаваемых в компонент (необязательно)
Метод возвращает экземпляр класса LivewireComponent.
Пример
Давайте создадим компонент Counter, который будем динамически создавать с помощью метода component:
<?php
namespace AppLivewire;
use LivewireComponent;
class Counter extends Component
{
public $initial = 0;
public $num = 0;
public function mount($initial = 0)
{
$this->initial = $initial;
$this->num = $initial;
}
public function inc()
{
$this->num++;
}
public function render()
{
return view('livewire.counter');
}
}
?>
<div>
<button wire:click="inc">+</button>
<span>{{ $num }}</span>
</div>
Теперь создадим контроллер, в котором динамически создадим компонент:
<?php
namespace AppHttpControllers;
use LivewireLivewire;
class HomeController extends Controller
{
public function index()
{
$component = Livewire::component('counter', ['initial' => 10]);
return view('home', ['component' => $component]);
}
}
?>
<div>
<h1>Dynamic component</h1>
{!! $component !!}
</div>
Результат выполнения кода:
<div>
<h1>Dynamic component</h1>
<div>
<button>+</button>
<span>10</span>
</div>
</div>
Пример
Давайте создадим компонент с несколькими параметрами и отобразим его в другом компоненте:
<?php
namespace AppLivewire;
use LivewireComponent;
class UserCard extends Component
{
public $name;
public $age;
public $city;
public function mount($name, $age, $city = 'Moscow')
{
$this->name = $name;
$this->age = $age;
$this->city = $city;
}
public function render()
{
return view('livewire.user-card');
}
}
?>
<div>
<h3>{{ $name }}</h3>
<p>Age: {{ $age }}</p>
<p>City: {{ $city }}</p>
</div>
<?php
namespace AppLivewire;
use LivewireComponent;
use LivewireLivewire;
class UserList extends Component
{
public $users = [
['name' => 'John', 'age' => 25, 'city' => 'New York'],
['name' => 'Jane', 'age' => 30, 'city' => 'London'],
['name' => 'Mike', 'age' => 28, 'city' => 'Paris'],
];
public function render()
{
$cards = [];
foreach ($this->users as $user) {
$cards[] = Livewire::component(
'user-card',
[
'name' => $user['name'],
'age' => $user['age'],
'city' => $user['city'],
]
);
}
return view('livewire.user-list', ['cards' => $cards]);
}
}
?>
<div>
<h2>Users</h2>
@foreach ($cards as $card)
{!! $card !!}
@endforeach
</div>
Результат выполнения кода:
<div>
<h2>Users</h2>
<div>
<h3>John</h3>
<p>Age: 25</p>
<p>City: New York</p>
</div>
<div>
<h3>Jane</h3>
<p>Age: 30</p>
<p>City: London</p>
</div>
<div>
<h3>Mike</h3>
<p>Age: 28</p>
<p>City: Paris</p>
</div>
</div>
Пример
Использование метода component для получения HTML представления компонента в виде строки:
<?php
namespace AppHelpers;
use LivewireLivewire;
class ComponentHelper
{
public static function renderComponent($name, $params = [])
{
$component = Livewire::component($name, $params);
return $component->render()->render();
}
}
?>
<?php
namespace AppHttpControllers;
use AppHelpersComponentHelper;
class ComponentController extends Controller
{
public function show()
{
$html = ComponentHelper::renderComponent(
'counter',
['initial' => 5]
);
return response($html);
}
}
?>
Результат выполнения кода:
"<div><button>+</button><span>5</span></div>"