我正在使用Bummen99购物车开发基于Laravel和Livewire的电子商务平台。我的问题是,我只能将项目添加到购物车,但由于某些原因,我无法更新(增加或减少)数量,从购物车中删除项目。我在控制台中没有错误,单击任一按钮都不会发生网络活动。我已经检查过所有的HTML都包含在一个
这是我的产品列表
@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>
我的布局。应用程序还具有livewire链接:
<head>
@livewireStyles
</head>
<body >
@livewireScripts
</body>
如果您要将字符串传递给wire:单击
方法,您应该用单引号封装它,如下所示
wire:click="increase('{{$product->rowId}}')"