如何在Laravel Blade中循环嵌套JSON并展示所有数据

第一步：修正控制器代码 #

你当前的控制器直接把Http请求的Response对象传递给视图了，这会导致Blade无法直接访问JSON里的字段。需要先将响应解析为数组：

public function fetch_all_campaigns(): \Illuminate\Contracts\View\Factory|\Illuminate\Contracts\View\View|\Illuminate\Contracts\Foundation\Application
{
    $headers = [
        "Content-Type" => "application/json",
        "Authorization" => "Token ****"
    ];

    $response = Http::get(
        "https://api.ringba.com/v2/XXXXXXXXXXXXXXXXXXX/campaigns",
        $headers
    );

    // 将JSON响应解析为数组，方便Blade调用
    $campaignData = $response->json();

    return view("Dashboard.Campaigns.campaigns", [
        "campaignData" => $campaignData
    ]);
}

第二步：Blade模板循环展示数据 #

根据你提供的JSON嵌套结构，在Blade里逐层嵌套@foreach循环即可遍历所有数据，以下是完整示例：

<div class="campaigns-wrapper">
    <!-- 展示顶层交易ID -->
    <h2>交易ID: {{ $campaignData['transactionId'] }}</h2>

    <!-- 循环外层campaigns数组 -->
    @foreach($campaignData['campaigns'] as $campaign)
        <div class="campaign-item">
            <!-- 循环每个campaign下的affiliateNumbers数组 -->
            @foreach($campaign['affiliateNumbers'] as $affiliateNum)
                <div class="affiliate-number-card">
                    <!-- 基础号码信息 -->
                    <h3>号码信息</h3>
                    <p><strong>国际号码:</strong> {{ $affiliateNum['phoneNumber'] }}</p>
                    <p><strong>本地号码:</strong> {{ $affiliateNum['localNumber'] }}</p>
                    <p><strong>显示号码:</strong> {{ $affiliateNum['displayNumber'] }}</p>
                    <p><strong>是否可释放:</strong> {{ $affiliateNum['deallocFlag'] ? '是' : '否' }}</p>
                    <p><strong>充值失败次数:</strong> {{ $affiliateNum['failedRechargeAttempts'] }}</p>
                    <p><strong>是否为运营商号码:</strong> {{ $affiliateNum['isCarrierNumber'] ? '是' : '否' }}</p>
                    <p><strong>仅内部使用:</strong> {{ $affiliateNum['isInternalOnly'] ? '是' : '否' }}</p>

                    <!-- 分配设置信息 -->
                    <h4>分配设置</h4>
                    <p><strong>国家代码:</strong> {{ $affiliateNum['assignmentSettings']['countryCode'] }}</p>
                    <p><strong>是否免费电话:</strong> {{ $affiliateNum['assignmentSettings']['isTollFree'] ? '是' : '否' }}</p>
                    <p><strong>分配限制:</strong> {{ $affiliateNum['assignmentSettings']['limit'] }}</p>

                    <!-- 关联方信息 -->
                    <h4>关联方详情</h4>
                    <p><strong>账户ID:</strong> {{ $affiliateNum['affiliate']['accountId'] }}</p>
                    <p><strong>关联方ID:</strong> {{ $affiliateNum['affiliate']['id'] }}</p>
                    <p><strong>子ID:</strong> {{ $affiliateNum['affiliate']['subId'] }}</p>
                    <p><strong>是否创建号码:</strong> {{ $affiliateNum['affiliate']['createNumbers'] ? '是' : '否' }}</p>
                    <p><strong>是否自身:</strong> {{ $affiliateNum['affiliate']['isSelf'] ? '是' : '否' }}</p>
                    <p><strong>标准反转:</strong> {{ $affiliateNum['affiliate']['isCriteriaInverted'] ? '是' : '否' }}</p>
                    <p><strong>关联方名称:</strong> {{ $affiliateNum['affiliate']['name'] }}</p>
                    <p><strong>启用状态:</strong> {{ $affiliateNum['affiliate']['enabled'] ? '已启用' : '已禁用' }}</p>
                    <p><strong>版本:</strong> {{ $affiliateNum['affiliate']['version'] }}</p>

                    <!-- 用户ID列表 -->
                    <h4>关联用户ID</h4>
                    <ul>
                        @foreach($affiliateNum['affiliate']['userIds'] as $userId)
                            <li>{{ $userId }}</li>
                        @endforeach
                    </ul>
                </div>
            @endforeach
        </div>
    @endforeach
</div>

关键说明 #

• 必须先将Http响应解析为数组/对象，Blade无法直接操作Response对象
• 循环层级严格对应JSON结构：transactionId → campaigns数组 → affiliateNumbers数组 → 内部对象字段
• 布尔值用三元表达式转换为中文表述，提升页面可读性
• 对于数组类型的字段（如userIds），需要额外嵌套@foreach遍历展示

内容的提问来源于stack exchange，提问作者Sakib ovi