Laravel Livewire unable to parse eloquent relationship with pagination on template

Question

I am having issue with livewire template rendering with Relationship-Eloquent with paginate method.

Livewire component:

<?php

namespace App\Http\Livewire;

use App\Models\User;
use Livewire\Component;
use App\Http\Controllers\AllUsersController;
use Livewire\WithPagination;

class DatatableComponent extends Component
{
    use WithPagination;
    /**
     * @var parent object
     * @property AllUsersController has to be replace using laravel Stubs
     */
    protected $parent = AllUsersController::class;

    /**
     * @var int
     */
    public $perPage = 1;

    /**
     * @var cities
     */
    public $cities;

    /**
     * @var states
     */
    public $states;

    /**
     * @var string
     */
    public $page_title = 'Users';

    /**
     * @var string
     */
    public $page_description = '';

    /**
     * @var array
     */
    public $users;

    /**
     * This used to set the initial value of the parent model.
     *
     * @return default
     */
    public function mount()
    {
        /** @todo initialize data using read method */
        $this->read();
    }

    /**
     * This used to initialize the data .
     * @return initial object
     * @todo  This has to be replaced by the other parent controller objects
     */
    protected function read()
    {
        /** @todo - set all public properties */
        $this->parent = new $this->parent;
        $this->states = $this->parent->getStates();
        $this->cities = $this->parent->getCities();
        $this->users = User::with(['logs' => function($query){
            $query->with('distinctMeta');
        }],'logsMeta','activity')->paginate($this->perPage);
    }

    /**
     * This used to return component.
     *
     * @param void public property
     * @return \Illuminate\Contracts\Foundation\Application|\Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function render()
    {
        return view('livewire.datatable-component');
    }
}

Steps which i followed.

when i checked the $this->users its returning the user object. but while accessing public $users property on template its returning error.

Error :

Undefined property: Livewire\CompilerEngineForIgnition::$files

Template:

<div class="card card-custom">
    <div class="card-body">
        {{-- moving form to partials --}}
        @include('livewire._partials.search')
        {{-- end move --}}
        <table class="table table-bordered table-hover">
            <thead>
            <tr>
                <th>{{ __('Email') }}</th>
            </tr>
            </thead>
            <thead>
                <tr>
                    @foreach($users as $index => $user)
                        <td>{{ $user->tualog->email }}</td>
                    @endforeach
                </tr>
            </thead>
        </table>
        {{ $users->links() }}
    </div>
</div>

Main issue - is unable to use paginate without toArray() method. but when i used toArray() on template {{ $users->links() }} method not working.

if anyone solved this issue please help with that.

Thanks in Advance

Answer 1

I have solved it by using local property for collection like this.

protected $collection

and assigning

$this->collection = $users = User::with([
            'logs' => function($query) {
                $query->with('distinctMeta');
            },
            'logsMeta',
            'activity'
        ])
        ->paginate($this->perPage);

I have changed render method with

 public function render()
 {
    return view('livewire.datatable-component',['users' =>$this->collection]);
 }

Answer 2

as Remul stated, you can't assign objects to public properties in a livewire component. Remove the $users public property and instead assign it in the render() method:

    public function render()
    {
        $users = User::with([
            'logs' => function($query) {
                $query->with('distinctMeta');
            },
            'logsMeta',
            'activity'
        ])
        ->paginate($this->perPage);

        return view('livewire.datatable-component', [
            'users' => $users
        ]);
    }