Single-File Components in Livewire v4: The View-First Approach

Learn how to create single-file components with the new .wire.php extension.

1 February 20261 min readLivewire اقرأ بالعربية

Livewire v4 introduces a view-first approach where PHP logic and Blade markup coexist in a single file.

File Location

resources/views/components/counter.wire.php

Basic Structure

php

@php
new class extends Livewire\Component {
    public $count = 0;
    
    public function increment() {
        $this->count++;
    }
}
@endphp

<div>
    Count: {{ $count }}
    <button wire:click="increment">+</button>
</div>

All articles

Keep reading

Single-File Components in Livewire v4: The View-First Approach

Learn how to create single-file components with the new .wire.php extension.

1 February 20261 min readLivewire اقرأ بالعربية

Livewire v4 introduces a view-first approach where PHP logic and Blade markup coexist in a single file.

File Location

resources/views/components/counter.wire.php

Basic Structure

php

@php
new class extends Livewire\Component {
    public $count = 0;
    
    public function increment() {
        $this->count++;
    }
}
@endphp

<div>
    Count: {{ $count }}
    <button wire:click="increment">+</button>
</div>

All articles