Tutorial Belajar Laravel: Cara Mengirim Data ke View Laravel

Dalam tutorial belajar Laravel 9 sebelumnya, kita sudah bahas cara membuat dan mengakses view dari route. Akan tetapi itu baru sekedar menampilkan isi view tanpa perubahan apapun. Agar lebih dinamis, kita bisa mengirim data dari route untuk ditampilkan di view.

Cara Mengirim Data dari Route ke View Laravel 9

Terdapat 2 cara mengirim data dari route ke view di Laravel 9:

Menulis data sebagai argument kedua dari function view().
Menggunakan method with().

Kita akan bahas keduanya.

Pada prakteknya nanti, data yang dikirim ke view lebih banyak berasal dari controller. Untuk menyederhanakan pembahasan, kita akan pakai data yang diinput dari route terlebih dahulu. Di controller nanti, cara pengirimannya juga hampir sama.

Mengirim Data ke View Sebagai Argument

Cara pertama untuk mengirim data dari route ke view adalah dengan menulis data tersebut sebagai argumen kedua pada saat pemanggilan function view(). Berikut contoh penggunaannya:

Route::get('/mahasiswa', function () {
  return view('mahasiswa',["mahasiswa01" => "Risa Lestari"]);
});

Tempatkan kode diatas ke dalam file route\web.php.

Perhatikan cara pemanggilan function view() di baris 2. Sebagai argumen pertama terdapat nama view yang akan ditampilkan. Dalam contoh ini saya ingin mengakses view 'mahasiswa'.

Selanjutnya sebagai argument kedua terdapat associative array berbentuk ["mahasiswa01" => "Risa Lestari"]. Inilah data yang ingin saya kirim ke view 'mahasiswa'.

Agar data ini bisa "ditangkap" oleh view, kita harus modifikasi kode program resources\views\mahasiswa.blade.php. Buka kembali file ini dan ubah sebagai berikut:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Belajar Laravel di Duniailkom</title>
</head>
<body>
<h1>Daftar Mahasiswa Kampus Ilkoom</h1>
  <ol>
    <li><?php echo $mahasiswa01; ?></li>
    <li>Sari Citra Lestari</li>
    <li>Rina Kumala Sari</li>
    <li>James Situmorang</li>
  </ol>
</body>
</html>

Di baris 12 terdapat perintah echo $mahasiswa01, inilah cara menampilkan data yang dikirim dari Route.

Pada saat penulisan route, array ["mahasiswa01" => "Risa Lestari"] diinput sebagai argumen kedua function view(). Array ini akan berubah jadi variabel $mahasiswa01 ketika sampai di dalam view.

Akses alamat http://localhost:8000/mahasiswa di web browser untuk melihat hasilnya:

Untuk mengirim lebih banyak data, tambah element baru ke dalam array yang akan dikirim:

Route::get('/mahasiswa', function () {
  return view('mahasiswa',
  [
  "mahasiswa01" => "Risa Lestari",
  "mahasiswa02" => "Sari Citra Lestari",
  "mahasiswa03" => "Rina Kumala Sari",
  "mahasiswa04" => "James Situmorang"
  ]);
});

Jika ditulis seperti ini, di dalam view mahasiswa setiap element array akan "dibuka" dan berubah menjadi variabel $mahasiswa01, $mahasiswa02, $mahasiswa03, dan $mahasiswa04. Untuk mengaksesnya kita bisa gunakan cara berikut:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Belajar Laravel di Duniailkom</title>
</head>
<body>
<h1>Daftar Mahasiswa Kampus Ilkoom</h1>
  <ol>
    <li><?php echo $mahasiswa01; ?></li>
    <li><?php echo $mahasiswa02; ?></li>
    <li><?php echo $mahasiswa03; ?></li>
    <li><?php echo $mahasiswa04; ?></li>
  </ol>
</body>
</html>

Hasil kode diatas akan sama seperti sebelumnya.

Menampilkan Data Array di View Menggunakan Foreach

Proses menampilkan data seperti contoh di atas tidak salah, tapi masih kurang efisien. Di dalam view kita harus men-echo satu per satu variabel $mahasiswa01, $mahasiswa02, dst.

Karena ini merupakan data yang berulang dan sama (berisi nama-nama mahasiswa), maka seharusnya bisa diproses menggunakan perulangan foreach PHP.

Namun struktur array yang dikirim juga harus diubah. Agar bisa diakses menggunakan perulangan foreach, kita harus rancang supaya data yang sampai di view masih berbentuk array, bukan variabel yang sudah dipecah. Solusinya, kirim data dalam bentuk nested array seperti contoh berikut:

Route::get('/mahasiswa', function () {
  $arrMahasiswa = [
    "Risa Lestari",
    "Rudi Hermawan",
    "Bambang Kusumo",
    "Lisa Permata"
  ];
  
  return view('mahasiswa',['mahasiswa' => $arrMahasiswa]);
});

Di baris 2 saya membuat $arrMahasiswa yang berisi daftar nama mahasiswa. Ketika array ini di kirim ke view, ditulis lagi sebagai ['mahasiswa' => $arrMahasiswa]. Sehingga begitu sampai di View, nama mahasiswa tetap berbentuk array dan bisa diakses dengan cara berikut:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Belajar Laravel di Duniailkom</title>
</head>
<body>
<h1>Daftar Mahasiswa Kampus Ilkoom</h1>
  <ol>
  <?php
    foreach ($mahasiswa as $nama) {
      echo "<li> $nama </li>";
    }
  ?>
  </ol>
</body>
</html>

Dengan teknik ini, kode program PHP di view menjadi lebih simple. Tidak peduli berapa banyak data yang dikirim dari route, selama data tersebut berbentuk array, maka bisa dilooping menggunakan foreach.

Mengirim Data ke View Menggunakan method With

Cara kedua yang bisa dipakai untuk mengirim data dari route ke view adalah menggunakan method with(). Berikut contoh penulisannya:

Route::get('/mahasiswa', function () {
  return view('mahasiswa')->with('mahasiswa01', 'Risa Lestari');
});

Method with() dipanggil dari function view(), teknik seperti ini dikenal dengan nama method chaining.

Method with() butuh 2 buah argument, argument pertama berupa nama variabel yang akan dikirim, serta argument kedua untuk menampung nilai yang dikirim.

Dengan route di atas, maka di dalam view mahasiswa akan terdapat variabel $mahasiswa01 yang berisi string 'Risa Lestari'. Sehingga bisa di tampilkan dengan kode berikut:

<h1>Daftar Mahasiswa</h1>
<ol>
  <li><?php echo $mahasiswa01; ?></li>
</ol>

Berikutnya, bagaimana cara mengirim data agar bisa di loop menggunakan foreach? Tidak masalah, tinggal mengirim data dalam bentuk array seperti contoh sebelumnya:

Route::get('/mahasiswa', function () {
  $arrMahasiswa = [
    "Risa Lestari",
    "Rudi Hermawan",
    "Bambang Kusumo",
    "Lisa Permata"
  ];
  return view('mahasiswa')->with('mahasiswa', $arrMahasiswa);
});

Sesampainya di dalam view, data bisa diakses dengan perulangan foreach:

<h1>Daftar Mahasiswa Kampus Ilkoom</h1>
<ol>
  <?php
    foreach ($mahasiswa as $nama) {
      echo "<li> $nama </li>";
    }
  ?>
</ol>

Hasilnya akan sama seperti contoh saat mengirim data sebagai argument.

Mengirim data ke View sangat sering kita lakukan. Dalam praktek real-nya, data ini biasa berasal dari database dan dikirim dari controller, bukan langsung dari route seperti ini.

Namun sebelum ke sana, kita akan bahas lagi konsep dasar penggunaan Laravel 9, salah satunya terkait perintah blade yang menjadi standar penulisan kode PHP di dalam view Laravel.

Saat ini di Duniailkom tersedia eBook / buku Laravel Uncover. Dengan total lebih dari 696 halaman A4, materi di buku jauh lebih banyak daripada tutorial Laravel di web Duniailkom. Penjelasan lebih lanjut bisa ke: Laravel Uncover – Panduan Belajar Framework Laravel 9.