I'm trying to paginate items in a livewire component, I have this query
protected $listeners = [
'franchises:coords' => 'getFranchises'
];
public $franchiseList;
public function getFranchises($coords)
{
if ($coords) {
$latitude = json_decode($coords)[0];
$longitude = json_decode($coords)[1];
$radiusInMeters = 800;
$this->franchiseList = Franchise::select(DB::raw('*, ( 6371000 * acos( cos( radians(' . $latitude . ') )
* cos( radians( latitude ) ) * cos( radians( longitude ) - radians(' . $longitude . ') )
+ sin( radians(' . $latitude . ') ) * sin( radians( latitude ) ) ) ) AS distance'))
->having('distance', '<', $radiusInMeters)
->orderBy('distance')
->paginate(8);
}
}
the component is included in my "maps.blade"
<div class="lg:basis-1/4 md:basis-1/4 sm:px-6 lg:px-8">
<livewire:franchise-list/>
</div>
and in my blade view, I have this
@if(!empty($franchiseList))
{{$franchiseList->links()}}
@endif
but I get this error
Livewire component's [franchise-list] public property [franchiseList] must be of type: [numeric, string, array, null, or boolean]. Only protected or private properties can be set as other types because JavaScript doesn't need to access them.
If I try to change pagination by adding these lines to the getFranchises
function and adding $links
to public
public $franchiseList, $links;
//after paginate
$this->links = $this->franchiseList;
$this->franchiseList = collect($this->franchiseList->items);
and in the blade change to this
@if(!empty($franchiseList) && $links->links())
{{$links->links()}}
@endif
I get this error
Error Cannot access protected property Illuminate\Pagination\LengthAwarePaginator::$items
How can I paginate in livewire? where is the problem?