You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在Twig中随机打乱模板渲染项的顺序?

在Twig中实现内容块随机排序的方案

当然可行!在Twig里实现这些渲染项的随机打乱完全没问题,我给你整理两种实用的实现思路:

方法一:直接在Twig中封装数组并打乱

你可以把每个独立的内容项(包括那3个随机书籍项拆分成单独的渲染调用)存入数组,再用Twig内置的shuffle过滤器打乱顺序,最后循环输出:

<ul class="row portfolio list-unstyled mt-3 lightbox" id="grid">
    {% set content_blocks = [
        render(controller('App\\Controller\\ReadController::summary')),
        render(controller('App\\Controller\\BookController::random', {num: 1})),
        render(controller('App\\Controller\\BookController::random', {num: 1})),
        render(controller('App\\Controller\\BookController::random', {num: 1})),
        render(controller('App\\Controller\\WikiController::random'))
    ] %}

    {% for block in content_blocks|shuffle %}
        {{ block }}
    {% endfor %}
</ul>

这里把原来一次返回3本随机书的调用拆成了三次单本调用,这样每本书都能作为独立元素参与排序,确保5个项完全随机打乱。

方法二:调整控制器返回格式(更灵活)

如果可以微调控制器的话,建议让BookController::random返回书籍数据数组,而不是直接渲染好的HTML。这样你可以在Twig里先收集所有数据项,打乱后再统一渲染:

比如控制器返回数据:

// BookController.php
public function random(int $num): Response
{
    $books = $this->bookRepository->findRandom($num);
    return $this->render('book/_random_data.html.twig', ['books' => $books]);
}

然后在Twig里:

<ul class="row portfolio list-unstyled mt-3 lightbox" id="grid">
    {% set summary = render(controller('App\\Controller\\ReadController::summary')) %}
    {% set random_books_data = render(controller('App\\Controller\\BookController::random', {num: 3})) %}
    {% set random_wiki = render(controller('App\\Controller\\WikiController::random')) %}

    {% set all_items = [summary] %}
    {% for book in random_books_data.books %}
        {% set all_items = all_items|merge([include('book/_item.html.twig', {book: book})]) %}
    {% endfor %}
    {% set all_items = all_items|merge([random_wiki]) %}

    {% for item in all_items|shuffle %}
        {{ item }}
    {% endfor %}
</ul>

这种方式耦合度更低,后续调整内容样式或逻辑会更方便。

看到你提到已经采用@hcoat的方法正常运行,后续打算尝试shuffle过滤器,上面的第一种方法就是最直接的shuffle用法,你可以根据实际场景选择适配~

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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.15 04:37:05