如何仅显示此 JSON 数组中的第一张图像？

Question

好的，我正在尝试将列出可收养宠物的 API 集成到 wordpress 网站中。我已经做了很多谷歌搜索并通读了教程，到目前为止，我已经设法组装了一个超级基本的插件，似乎可以完成我想要完成的工作。目前我正在尝试提取图像，但只是第一张图像。每只动物可能有 5 张与之关联的图像，但我只想拉入第一个（默认）。目前我的代码带来了所有这些。现在我意识到问题是我正在使用“foreach()”。但是，这对我来说是新的，我的谷歌搜索并不顺利，我尝试过的任何其他方式都只是没有给我任何照片。任何建议表示赞赏....如果我做错了什么，请随时告诉我:) 我还需要弄清楚如何对其进行分页，但我认为这是一个单独的问题！谢谢！

<?php
add_shortcode('pets', 'petsshortcode');
function petsshortcode() {
$request = wp_remote_get( 'https://petstablished.com/api/v2/public/pets?public_key=UlEK4EWvDAoOjXeQXSCQZAyBywWfqfOg&search[status]=available,foster&pagination[limit]=20&pagination[page]=1' );

if( is_wp_error( $request ) ) {
	return false; // Bail early
}
$body = wp_remote_retrieve_body( $request );

$data = json_decode( $body );

if( ! empty( $data ) ) {
	
	foreach( $data->collection as $collection ) {
		echo '<div id="pet-block"><ul class="pet-profile"><li class="pet-name">'. $collection->name;	echo '</li>';
		echo '<li class="pet-meta">'.'<span class="sex">' . $collection->sex; echo '</span>' . '<span class="breed">' . $collection->breed; echo '</span><span class="age">' . $collection->age; echo '</span></li>';
		echo '<li><p>' . $collection->description; echo '</li></p>';		
	foreach( $collection->images as $images ) {
		echo '<div class="pet-photo"><img src="' . $images->image->url; echo '" width="200"></div>';}
		echo '</ul></div>'; 
	}
}
}

Answer 1

在这种情况下，您不需要嵌套 foreach 循环，只需使用一个 foreach 循环，如下所示：

// your code
foreach( $data->collection as $collection ) {
    echo '<div id="pet-block"><ul class="pet-profile"><li class="pet-name">'. $collection->name;    echo '</li>';
    echo '<li class="pet-meta">'.'<span class="sex">' . $collection->sex; echo '</span>' . '<span class="breed">' . $collection->breed; echo '</span><span class="age">' . $collection->age; echo '</span></li>';
    echo '<li><p>' . $collection->description; echo '</li></p>';        
    echo '<div class="pet-photo"><img src="' . $collection->images[0]->image->url; echo '" width="200"></div>';
    echo '</ul></div>'; 
}
// your code