Hello everyone. I told In this article, partial and lazy data loading on Laravel with Inertiajs.
First:
In Vuejs template, add property “only: [‘props_name‘]” to Inertiajs visit or reload methods.
Like:
onSearchChange: throttle(function (term) {
this.$inertia.get(
route("project.create"),
{ term },
{
preserveState: true,
preserveScroll: true,
replace: true,
only: ['contracts'],
}
);
}, 200),
Second:
In Laravel controller, when if you want to page first load, get data write like bottom anonymous function:
public function create()
{
return Inertia::render('Project/create', [
'contracts' => function () {
return Contract::limit(15)->get();
},
]);
}
If you want to requested only result
public function create()
{
return Inertia::render('Project/create', [
'contracts' => Inertia::lazy(fn () => Contract::limit(15)->get()),
]);
}
Source: https://inertiajs.com/partial-reloads