javascript - Laravel Livewire 电线：点击不触发

问题描述

我正在使用 bumbummen99购物车开发基于 Laravel 和 Livewire 的电子商务平台。我的问题是我只能将商品添加到购物车，但由于某种原因我不能更新（增加或减少）数量，从购物车中删除商品。我在控制台中没有错误，单击任何一个按钮时都没有发生网络活动。我已经检查过所有的 HTML 都包含在一个 <div>. 我检查了其他几个页面（这里，这里，这里），但没有运气。我还尝试更改不工作的电线：单击以遵循电线的格式：单击正在工作的 addToCart，这也没有帮助。任何帮助是极大的赞赏。

这是我的产品列表

@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

这是我的 CartListing 组件：

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'));
}



}

这是我的 livewire 购物车列表视图：

<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>

我的 layouts.app 也有 livewire 链接：

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

标签： javascriptphplaravellaravel-livewire

javascript - Laravel Livewire 电线：点击不触发

问题描述

解决方案

推荐阅读