I am working on a Laravel project and I have a Blade component for displaying a data table. However, I am encountering an Undefined variable $data error when trying to pass data from my controller to the Blade component.
<?php
namespace App\Http\Controllers;
use App\Models\User;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Log;
class UserController extends Controller
{
public function index()
{
$users = User::paginate(10);
return view('users.index', compact('users'));
}
}
@extends('layouts.index-base')
@section('title', 'Gestión de Usuarios')
@section('content_header')
<h1>Lista de Usuarios</h1>
@stop
@section('header')
<x-column-filter :routes="['trabajadores.index', 'trabajadores.create']" filter="name" placeholder="Ingrese el nombre del usuario" columnSize="4" module="Usuario" />
@stop
@section('table')
<x-data-table :data="$users" :titles="['DNI', 'Nombre', 'Correo', 'Fecha de Nacimiento', 'Rol', 'Acciones']" :columns="[
['key' => 'dni'],
['key' => 'name'],
['key' => 'email'],
['key' => 'fecha_nacimiento'],
['key' => 'rol', 'relationship' => true, 'attribute' => 'nombre'],
]" :routes="[
'edit' => 'trabajadores.edit',
'disable' => 'trabajadores.disable',
'enable' => 'trabajadores.enable',
]" />
@stop
@section('footer-1', $users->links())
<?php
namespace App\View\Components;
use Closure;
use Illuminate\Contracts\View\View;
use Illuminate\View\Component;
class DataTable extends Component
{
public $data;
public $titles;
public $columns;
public $routes;
public function __construct($data, $titles, $columns, $routes)
{
$this->data = $data;
$this->titles = $titles;
$this->columns = $columns;
$this->routes = $routes;
}
public function render(): View|Closure|string
{
return view('components.data-table');
}
}
<table class="table table-head-fixed table-hover text-nowrap">
<thead>
<tr>
@foreach ($titles as $title)
<th>{{ $title }}</th>
@endforeach
</tr>
</thead>
<tbody>
@foreach ($data as $item)
<tr>
@foreach ($columns as $column)
@if (isset($column['relationship']) && $column['relationship'])
<td>{{ $item->{$column['key']}->{$column['attribute']} }}</td>
@else
<td>{{ $item->{$column['key']} }}</td>
@endif
@endforeach
<td>
<a href="{{ route($routes['edit'], $item) }}" class="btn btn-warning">
<i class="fas fa-pencil-alt"></i>
</a>
@if ($item->estado)
<form action="{{ route($routes['disable'], $item) }}" method="POST" class="d-inline">
@csrf
@method('patch')
<button class="btn btn-danger" type="submit">
<i class="fas fa-lock"></i>
</button>
</form>
@else
<form action="{{ route($routes['enable'], $item) }}" method="POST" class="d-inline">
@csrf
@method('patch')
<button class="btn btn-success" type="submit">
<i class="fas fa-unlock"></i>
</button>
</form>
@endif
</td>
</tr>
@endforeach
</tbody>
</table>
When I developed it on Manjaro it worked fine and when I tested it on Windows 10, it stopped working, but changing the variable name from $data to $info in both the component and the view, it works fine. However, I would like to understand why $data is causing a problem and how to fix it without changing the variable name.
data
is a reserved keyword in Blade components, just like render
,
resolveView
, shouldRender
, view
, withAttributes
and withName
.
You cannot use these as variable names with Blade components.
Read up on this in the docs: https://laravel.com/docs/11.x/blade#reserved-keywords.