使用灯箱面板选项查看使用UIKIT发布的所有照片 "items"

Question

我正在使用UIKIT Lightbox来显示像Facebook这样的帖子图像，如下所示:

控制器

$postImages = postsImages::where('postId', $post->postId)->limit(3)->get();

叶片

<div class="uk-child-width-1-3@m" uk-grid uk-lightbox="animation: slide">
@foreach ($postImages as $postImage)
<div>
<a class="uk-inline" href="{{$postImage->imageLink}}">
<img src="{{$postImage->imageLink}}">
@if ($loop->last && $post->hasImage > 3)
<div class="uk-overlay-default uk-position-cover more">
<div class="uk-position-center">
<h1>+{{$post->hasImage - 3}}</h1>
</div>
</div>
@endif
</a>
</div>
@endforeach
</div>

我将图像缩略图限制为3，其余的将显示为+number_of_remaining_photos和Facebook一样。

问题是，当我点击缩略图使其变大并查看其余部分时，我只能看到我限制的那三个图像。

我浏览了UIKIT lightbox文档，我找到了items选项，但我不知道如何使用它，以便通过创建另一个查询来查看该帖子的所有图像，如下所示:

$postImages = postsImages::where('postId', $post->postId)->get();

获取所有图像并显示在灯箱中。

注:我不确定，这是否是item选项。)

Answer 1

这是一个实用的解决方案。

1-执行另一个没有限制的查询。

$postImagesAll = postsImages::where('postId', $post->postId)->get();

2-将data-uk-lightbox="{group:'my-group'}"属性添加到下面两个查询的结果中，一切都会正常工作:

<div class="uk-grid-collapse" uk-grid uk-lightbox="animation: slide;">
@foreach ($postImages as $postImage)
<div>
<a class="uk-inline" href='/storage/posts/{{$postImage->imageLink}}' data-uk-lightbox="{group:'my-group'}">
<img src="{{$postImage->imageLink}}"/>
@if ($loop->last && $post->hasImage > 3)
<div class="uk-overlay-default uk-position-cover more">
<div class="uk-position-center">
<h1>+{{$post->hasImage - 3}}</h1>
</div>
</div>
@endif
</div>
</a>
</div>
@endforeach
@foreach ($postImagesAll as $postImage)
<a class="uk-hidden" href="{{$postImage->imageLink}}" data-uk-lightbox="{group:'my-group'}"></a>
@endforeach
</div>