Laravel Livewire wire:click not firing

Question

I am working on an e-commerce platform based on Laravel and Livewire using the bumbummen99 shopping cart. My problem is that I can only add items to the cart, but for some reason I cannot, update(increase or decrease) the quantity, delete an item from the cart. I have no error in the console, no network activity is happening upon clicking either of the buttons. I have checked that all the HTML is enclosed in one <div>. I have checked a couple of other pages (here, here, here)but no luck. I also tried changing the not working wire:clicks to follow the format of the wire:click addToCart which is working, that also did not help. Any help is greatly appreciated.

Here is my products listing table

@extends('layouts.app')

@section('template_linked_css')
<link href="{{asset('front/css/cart.css')}}" rel="stylesheet">

@endsection

@section('content')
<main class="bg_gray">
    @livewire('cart-listing')
</main>
@endsection

Here is my CartListing Component:

use App\Models\Service;
use Gloudemans\Shoppingcart\Facades\Cart;
use Livewire\Component;

class CartListing extends Component
{
public $products;
public array $quantity = [];

public function mount()
{
    $this->products = Cart::content();
    foreach ($this->products as $product) {
        $this->quantity[$product->id] = 1;
    }
}

public function addToCart($product_id)
{
    $product = Product::findOrFail($product_id);
    Cart::add(
        $product->id,
        $product->name,
        $this->quantity[$product_id],
        $product->price
    );

    $this->emit('cart_updated');
}

public function increase($rowId){
    Cart::update($rowId, 1);
    $this->emit('cart_updated');
}

public function decrease($rowId){
    Cart::update($rowId, -1);
    $this->emit('cart_updated');
}

public function deleteItem($rowId){
    Cart::remove($rowId);
    $this->emit('cart_updated');
}

public function render()
{
    $cart = Cart::content();
    $cart_count = Cart::content()->count();
    $cart_total = Cart::subtotal();

    return view('livewire.cart-listing', compact('cart', 'cart_count', 'cart_total'));
}



}

Here is my livewire cart-listing view:

<div>
    <div class="container margin_30">
        <div class="page_header">
            <div class="breadcrumbs">
                <ul>
                    <li><a href="#">Home</a></li>
                    <li>Cart</li>
                </ul>
            </div>
            <h1>Cart</h1>
        </div>
        <!-- /page_header -->
        <table class="table table-striped cart-list">
            <thead>
            <tr>
                <th>
                    Product
                </th>
                <th>
                    Price
                </th>
                <th>
                    Quantity
                </th>
                <th>
                    Subtotal
                </th>
                <th>

                </th>
            </tr>
            </thead>
            <tbody>
            @forelse ($products as $product)
            <tr>
                <td>
                    <div class="thumb_cart">
                        <img src="{{asset('front/img/products/product_placeholder_square_small.jpg')}}" data-src="{{asset('front/img/products/shoes/1.jpg')}}" class="lazy" alt="Image">
                    </div>
                    <span class="item_cart">{{$product->name}}</span>
                </td>
                <td>
                    <strong>£ {{$product->price}}</strong>
                </td>
                <td>
                    <div class="numbers-row">
                        <input type="text" value="{{$product->qty}}" id="quantity_1" class="qty2" name="quantity_1">
                        <div wire:click="increase({{$product->rowId}})" class="inc button_inc">+</div>
                        <div wire:click="decrease({{$product->rowId}})" class="dec button_inc">-</div>
                    </div>
                </td>
                <td>
                    <strong>£ {{number_format($product->price * $product->qty, 2,'.',',')}}</strong>
                </td>
                <td class="options">
                    <a wire:click="deleteItem({{$product->rowId}})"><i class="ti-trash"></i></a>
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="3">
                    <span class="item_cart">Your cart is empty</span>
                </td>
            </tr>
            @endforelse
            </tbody>
        </table>
    </div>
    <!-- /container -->

    <div class="box_cart">
        <div class="container">
            <div class="row justify-content-end">
                <div class="col-xl-4 col-lg-4 col-md-6">
                    <ul>
                        <li>
                            <span>Subtotal</span> $ {{$cart_total}}
                        </li>
                        <li>
                            <span>Total</span> $ {{$cart_total}}
                        </li>
                    </ul>
                    <a href="cart-2.html" class="btn_1 full-width cart">Proceed to Checkout</a>
                </div>
            </div>
        </div>
    </div>
    
</div>

My layouts.app has the livewire links as well:

<head>
    @livewireStyles
</head>
<body >
@livewireScripts
</body>

Answer 1

You should check whether livewire.php is present or not in the config folder. If there is no livewire.php file in the config folder, you should run the following command to add it in:

php artisan vendor:publish --tag=livewire:config

Answer 2

If you are passing a string to the wire:click method you should encapsulate it with single quotes like this

wire:click="increase('{{$product->rowId}}')"