Propiedades en Livewire

EJEMPLO 1

En la view del componente:
<button wire:click='incrementar'>Aumentar valor</button>
<h2>{{ $count }}</h2>
En el componente:
public $count;
public function incrementar()
$this->count++;
}

EJEMPLO 2

En la view del componente:
<h1>{{ $titulo}}</h1>
<p>{{ $desc }}</p>
En el componente: public $titulo;
public $desc;

public function mount($arrAux) {
$this->titulo = $arrAux["titulo"];
$this->desc = $arrAux["desc"];
}
En la view que llama a ese componente:
@php
$count = 11;
$arrAux = [
'titulo' => 'Aquí pondrás el título',
'desc' => 'Aquí va la descripción'
];
@endphp
<livewire:counter :count="$count" :arrAux="$arrAux">

EJEMPLO 3

En la view del componente:
<input type="text" placeholder="añadir nuevo país" wire:model="pais">
<button wire:click="agregar">Enviar

<h1>Lista de países </h1>
<ul>
@foreach ($paises as $pais)
<li>{{$pais}} </li>
@endforeach
</ul>

En el componente:
public $paises = [
'España','Italia','Francia','Alemania'
@livewireScripts ];

public $pais;
public function agregar() {
$this->paises[] = $this->pais;
$this->reset('pais');
}

Si queremos no hace falta tener una vista pues desde routes/web.php se puede llamar directamente al componente Livewire:
use App\Http\Livewire\Paises;
Route::get('/', Paises::class);

Pero para que funcione tienes q crear una vista vacía (solo con HTML básico) en resources\views\layouts\app.blade.php y añadir: @livewireStyles
...
{{ $slot }}
...
@livewireScripts

No hay comentarios:

Publicar un comentario