'All livewire functions not firing?

For some reason all of the livewire functions in my program have suddenly stopped working and I have no idea why. For example when I click the function to add friend it doesn't fire at all

This is what my app.blade.php part looks like

<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="csrf-token" content="{{ csrf_token() }}">

        <title>{{ config('app.name', 'Laravel') }}</title>

        <!-- Fonts -->
        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">

        <!-- Styles -->
        <link rel="stylesheet" href="{{ asset('css/app.css') }}">
        <link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet">
            <script src="{{ asset('js/app.js') }}" defer></script>


@livewireStyles

                <!-- Scripts -->
    
            <script src="{{ asset('js/app.js') }}" defer></script>
            @livewireScripts
        </head>
        <body class="font-sans antialiased">

This is what the AddFriend component class looks like:

class AddFriend extends Component
{
//    public $user;

    public function render()
    {
        $users = User::where('id', '!=', Auth::user()->id)->limit(14)->latest()->get();

        $usersid=User::orderBy('created_at', 'desc')->pluck('id');



        $attribute= Attribute::whereIn('user_id',$usersid)->get();
       // dd($attribute);
        return view('livewire.add-friend', compact('users'));
    }

    public function addToFriend($id)
    {
        try {
            $user = Auth::user();
            $recipient = User::find($id);
            if (!$recipient) {
                $this->dispatchBrowserEvent('alert', ['type' => 'error', 'message' => 'User not found!']);
            } else {
                if ($user->befriend($recipient)) {
                    $this->dispatchBrowserEvent('alert', ['type' => 'success', 'message' => 'Request has been sent!']);

                } else {
                    $this->dispatchBrowserEvent('alert', ['type' => 'error', 'message' => 'Request has been failed!']);
                }
            }

        } catch (\Exception $e) {
            $this->dispatchBrowserEvent('alert', ['type' => 'error', 'message' => $e->getMessage()]);
        }
    }

This is what the all_users.blade.php looks like:

@extends('layouts.app')

@section('content')

@if ($message = Session::get('success'))
    <div class="alert alert-success">
        <p>{{ $message }}</p>
    </div>
@endif


<article>

<div>
        @livewire('add-friend')
</div>

This is the main part where the livewire function gets rendered(add-friend.blade.php):

<div>
@foreach ($users as $user)
<div render:poll="render">
    <h3>{{$user->name}}</h3>

@if($user->attributes!=null)
    <p>Grade is {{$user->attributes->GradeLevel}}</p>
    <p>Age is {{$user->attributes->Age}}</p>
    <p>Country is {{$user->attributes->Country}}</p>
@endif
            @if(Auth::user()->hasSentFriendRequestTo($user))
                <x-button  type="submit" class="btn btn-red">Requested</x-button>
            @elseif(Auth::user()->isFriendWith($user))
                <x-button class="btn btn-green"  type="submit" >Friends</x-button>
            @else
                <button  wire:click="addToFriend({{ $user->id }})" class="btn btn-warning" type="button" > Add Friend</button>
            @endif


    </div>
@endforeach


</div>

I'm not sure what the issue as I'm being told that its to do with the div tags but they all surround the livewire tabs, so I'm not too sure , so it could be anything really. I don't know why all of the livewire functions have all stopped working and normal functions work fine



Solution 1:[1]

I can't say for sure, but I'm almost certain you're not supposed to be doing what you're doing in the render() method on your component.

In Livewire, render() is called on each component update, so you really don't want to use it to pass-in attributes like that. Instead, you should create properties on your Livewire component, and use $this->foo in your Blade template to access that data — refreshing state via component methods when necessary.

At the very least, querying your DB on each component render has some pretty bad implications where performance is concerned. You should move this logic into the mount() method on your component, and then store it in a public property for use in your Blade template. Also, where you're iterating in a @foreach, don't forget to include wire:key to help Livewire keep track of what needs updating.

Lastly, I'm not sure what render:poll="render" is in your Blade template. As far as I know, this isn't a Livewire attribute, and I can't find another reference of it in Laravel. Is this something custom or from another package?

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 stephancasas