Conditional Rendering

Halaman web nyata hampir tidak pernah menampilkan konten yang sama untuk semua kondisi. Menu berubah mengikuti status login, panel muncul hanya bila datanya ada, dan status tugas menentukan badge yang ditampilkan. Blade menyediakan satu keluarga directive percabangan untuk kebutuhan ini — semuanya dikompilasi menjadi if PHP biasa, jadi tidak ada sintaks baru yang harus dihafal. Chapter ini menguji setiap directive dengan output nyata pada tiap cabangnya, dari @if sampai @switch, termasuk jebakan halus pada string kosong.

Percabangan dengan @if #

Directive @if, @elseif, dan @else adalah bentuk Blade dari if PHP — kondisinya pun ekspresi PHP biasa. View status.blade.php berikut memilih pesan berdasarkan variabel $status:

@if ($status === 'selesai')
    <p>Tugas selesai, kerja bagus.</p>
@elseif ($status === 'proses')
    <p>Tugas sedang dikerjakan.</p>
@else
    <p>Status belum jelas.</p>
@endif

Kita render view tersebut tiga kali dengan nilai $status yang berbeda:

=== @if tiga cabang ===
<p>Tugas selesai, kerja bagus.</p>
<p>Tugas sedang dikerjakan.</p>
<p>Status belum jelas.</p>

Hanya satu cabang yang aktif per render — tepat perilaku if/elseif/else di PHP. Blok ditutup dengan @endif, bukan kurung kurawal, sehingga struktur template tetap terbaca meski bercampur tag HTML.

Negasi dengan @unless #

@unless adalah kependekan dari @if(! ...): bloknya dirender saat kondisi bernilai salah. View akses.blade.php memakai directive ini untuk pesan pengunjung yang belum menjadi anggota:

@unless($anggota)
    <p>Silakan masuk sebagai anggota.</p>
@endunless

Saat $anggota bernilai false, pesan tampil; saat true, blok dilewati. Pada uji berikut, baris pertama memakai $anggota = false dan baris kedua $anggota = true:

=== $anggota = false ===
<p>Silakan masuk sebagai anggota.</p>

=== $anggota = true ===
(kosong — blok dilewati)

Memeriksa Variabel dengan @isset dan @empty #

@isset merender bloknya hanya saat variabel ada dan bukan null; @empty kebalikannya — aktif saat variabel tidak ada, null, atau bernilai kosong. Keduanya meniru fungsi PHP isset() dan empty(). Lengkapkan akses.blade.php:

@isset($catatan)
    <p>Catatan: {{ $catatan }}</p>
@endisset

@empty($catatan)
    <p>Belum ada catatan.</p>
@endempty

Dua skenario berikut memperlihatkan hasil render untuk catatan terisi dan string kosong:

=== $catatan = 'Rilis hari Jumat' ===
<p>Catatan: Rilis hari Jumat</p>

=== $catatan = '' ===
<p>Catatan: </p>

<p>Belum ada catatan.</p>

Skenario kedua memuat pelajaran penting: string kosong tetap ter-set, jadi @isset merendernya — tetapi sekaligus dianggap empty oleh PHP, jadi @empty juga aktif. Kedua blok tampil bersamaan.

Banyak Cabang dengan @switch #

Saat satu variabel punya banyak nilai tetap, @switch lebih rapi daripada deretan @elseif. Setiap @case ditutup @break, dan @default menampung nilai lainnya:

@switch($peran)
    @case('admin')
        <p>Akses penuh ke semua menu.</p>
        @break

    @case('editor')
        <p>Boleh menulis dan menyunting artikel.</p>
        @break

    @default
        <p>Akses baca saja.</p>
@endswitch

Output yang Dihasilkan untuk $peran berturut-turut 'admin', 'editor', dan 'pengunjung':

<p>Akses penuh ke semua menu.</p>
<p>Boleh menulis dan menyunting artikel.</p>
<p>Akses baca saja.</p>

Aturan praktisnya: bila kondisi menguji nilai tetap dari satu variabel yang sama, @switch lebih terbaca; bila tiap cabang menguji kondisi berbeda — misalnya $status === 'selesai' lalu $skor > 75 — @if/@elseif tetap pilihan yang tepat. Ingat pula untuk selalu menulis @break: uji nyata pada @case('admin') yang sengaja tidak ditutup @break membuktikan eksekusi jatuh ke case berikutnya, sehingga blok admin sekaligus blok editor ikut terkirim — perilaku yang sama persis dengan switch PHP.

Operator Ternary di Dalam Echo #

Untuk cabang satu baris — badge lulus/remedial misalnya — operator ternary langsung di dalam {{ }} lebih ringkas tanpa directive sama sekali:

<p>Skor {{ $skor }}: {{ $skor >= 75 ? 'Lulus' : 'Remedial' }}</p>

Output yang Dihasilkan untuk $skor 80 dan 60:

<p>Skor 80: Lulus</p>
<p>Skor 60: Remedial</p>

Preview: @forelse untuk Koleksi Kosong #

Cabang yang paling sering dibutuhkan — “daftar berisi item” lawan “daftar kosong” — punya directive khusus. @forelse menggabungkan @foreach dan blok @empty sebagai penampung kondisi kosong:

<ul>
@forelse ($tugas as $judul)
    <li>{{ $judul }}</li>
@empty
    <li>Belum ada tugas minggu ini.</li>
@endforelse
</ul>

Output untuk koleksi terisi dan koleksi kosong:

<ul>
    <li>Belajar Blade</li>
    <li>Uji coba view</li>
</ul>
<ul>
    <li>Belum ada tugas minggu ini.</li>
</ul>

Percabangan dan perulangan adalah dua sisi mata uang tampilan dinamis. Kita sudah melirip @forelse; saatnya bedah penuh keluarga perulangan beserta variabel ajaib $loop pada chapter Looping di Blade.