You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Laravel中如何在Blade展示订单关联的商品列表?

在Laravel Blade中展示订单及关联商品列表

嘿,既然你已经摸透了Laravel的关联关系和预加载这些知识点,那咱们直接上手搞定订单列表里的商品展示问题!

首先先快速确认下模型关联的配置(毕竟这是基础前提):
如果你的数据库结构是orders表关联order_items订单项表,再关联products商品表,那模型关联应该这么写:

// app/Models/Order.php
public function items()
{
    // 一个订单对应多个订单项
    return $this->hasMany(OrderItem::class);
}
// app/Models/OrderItem.php
public function product()
{
    // 一个订单项对应一个商品
    return $this->belongsTo(Product::class);
}

要是你的结构更简单,products表直接存order_id(一个订单对应多个商品的一对多关系),那Order模型的关联就改成:

public function products()
{
    return $this->hasMany(Product::class);
}

第一步:控制器里预加载关联数据

因为有100条订单,必须用with预加载来避免N+1查询问题,这能大幅提升页面加载性能:

// 比如 OrdersController.php
public function index()
{
    // 通过订单项关联商品的情况,预加载items和对应的product
    $orders = Order::with('items.product')->get();
    
    // 直接关联商品的情况,用下面这句
    // $orders = Order::with('products')->get();
    
    return view('orders.index', compact('orders'));
}

第二步:Blade视图里渲染订单和商品列表

接下来在你的Blade视图(比如resources/views/orders/index.blade.php)里,用表格对应你给的示例格式来展示:

<div class="container">
    <h1>Order List</h1>
    <table class="table table-striped">
        <thead>
            <tr>
                <th>Order ID</th>
                <th>Email</th>
                <th>List of Products</th>
                <th>Status</th>
            </tr>
        </thead>
        <tbody>
            @foreach($orders as $order)
                <tr>
                    <td>{{ $order->id }}</td>
                    <td>{{ $order->email }}</td>
                    <td>
                        <!-- 处理订单项关联商品的情况 -->
                        @if($order->items->isNotEmpty())
                            @foreach($order->items as $item)
                                {{ $item->product->name }} (${{ number_format($item->product->price, 2) }})
                                @if(!$loop->last), @endif
                            @endforeach
                        @else
                            <em>No products in this order</em>
                        @endif

                        <!-- 如果是直接关联商品的情况,替换成下面这段 -->
                        {{-- @if($order->products->isNotEmpty())
                            @foreach($order->products as $product)
                                {{ $product->name }} (${{ number_format($product->price, 2) }})
                                @if(!$loop->last), @endif
                            @endforeach
                        @else
                            <em>No products in this order</em>
                        @endif --}}
                    </td>
                    <td>{{ ucfirst($order->status) }}</td>
                </tr>
            @endforeach
        </tbody>
    </table>
</div>

几个实用的小优化

  • number_format()格式化价格,确保显示两位小数,更符合电商场景的展示习惯;
  • $loop->last控制商品之间的逗号,避免最后一个商品后面多出来冗余符号;
  • 增加空商品的提示,避免页面出现空白;
  • 如果需要给商品加跳转链接,直接在循环里修改:
    <a href="{{ route('products.show', $item->product) }}">{{ $item->product->name }}</a> (${{ number_format($item->product->price, 2) }})
    

这样就能完美展示你的订单列表,每个订单的商品也能正确渲染啦!

内容的提问来源于stack exchange,提问作者don16

火山引擎 最新活动