When I setup a datatable, regardless of the object I use, I end up with it attempting to load and eventually timing out. I'm not even sure how to start debugging this.
I've followed some of the examples here: https://livewire-datatables.com/ and simple data tables like:
<livewire:datatable model="App\User" exclude="planet_id, bio, latitude, longitude, updated_at" />
Work perfectly. The problem I'm having is when I try anything that requires it's own Datatable class.
My steps/code are as follows:
php artisan livewire:make jobs-data-table
jobs-data-table.blade.php
<livewire:jobs-data-table searchable="title" exportable />
JobsDataTable
<?php
namespace App\Http\Livewire;
use \App\Models\Job;
use Livewire\Component;
use Illuminate\Support\Str;
use Illuminate\Support\Carbon;
use Illuminate\Support\Facades\DB;
use Mediconesystems\LivewireDatatables\Column;
use Mediconesystems\LivewireDatatables\DateColumn;
use Mediconesystems\LivewireDatatables\TimeColumn;
use Mediconesystems\LivewireDatatables\NumberColumn;
use Mediconesystems\LivewireDatatables\BooleanColumn;
use Mediconesystems\LivewireDatatables\Http\Livewire\LivewireDatatable;
class JobsDataTable extends Component
{
public function builder()
{
return
Job::query()->take(10)->get(2);
}
}
Then I setup a simple test route:
Route::get('/test', function () {
return view('/livewire/jobs-data-table');
});
The route works, but ultimately times out, with no error beyond the timeout exception.
You are creating an infinite loop - by making the component render itself over and over.
Your route calls the view livewire/jobs-data-table.blade.php
- and the view calls the JobsDataTable
component through <livewire:jobs-data-table ../>
. This will return a new instance of the view, livewire/jobs-data-table
, which again will initialize the JobsDataTable
component and continue with that loop until it times out.
Normally, when rendering a full-page Livewire component, you would call the class in the route, not the view directly, that way you render the entire component and not only the view - meaning that using render()
on any views within the livewire
folder is bad practice.
Route::get('/test', App\Http\Livewire\JobsDataTable::class);
However, doing this will not solve your problem, it wouldn't change anything. You need to render the component once.
To solve your problem, you need to render the component in such a way that it doesn't call on itself in the view. That means that your livewire/jobs-data-table.blade.php
view cannot call <livewire:jobs-data-table ../>
. Since there's not much more code to show what its doing, being more explicit on what to change exactly is difficult.