Symfony呈现控制器和引导选项卡

Posted 2021-04-21

我的应用程序中有3个选项卡，我需要为每个选项卡呈现特定的控制器。问题是，它适用于第一个选项卡，但在我开始导航后没有那么多。基本上，几乎所有已加载到页面上的内容都保留在页面上。因此，如果我单击第二个选项卡，它会累加第一个选项卡的内容。当我回到第一个时，它保持不变。我的标签与纯文本一起工作得很好，所以我猜测在渲染控制器时我做错了什么。你们中的任何人都可以对此有所了解吗？

<div class="row">
    <ul class="nav nav-tabs col-lg-12" id="myTabs" role="tablist">
        <li class="nav-item col-lg-3">                       
            <a class="nav-link active" data-toggle="tab" href="#bouteille" role="tab" aria-controls="bouteille" aria-selected="true">Bouteille</a>
         </li>
         <li class="nav-item col-lg-3">
             <a class="nav-link" data-toggle="tab" href="#membre" role="tab" aria-controls="membre" aria-selected="false">Membre</a>
         </li>
         <li class="nav-item col-lg-3">
             <a class="nav-link" data-toggle="tab" href="#pointDeVente" role="tab" aria-controls="pointDeVente" aria-selected="false">Point de vente</a>
          </li>
      </ul>
  </div>

  <div class="row">
      <div class="tab-content col-lg-12" id="myTabContent">                   
          <div class="tab-pane active" id="bouteille" role="tabpanel" aria-labelledby="bouteille-tab">
               {% block flashBag %}
                   {% for message in app.session.flashbag.get("info") %}
                       <div class="alert alert-success alert-dismissable fade show " role="alert" class="col-lg-12">
                                {{ message }}
                        </div>    
                   {% endfor %}
               {% endblock flashBag %}
               {{ render(controller("App\Controller\BouteilleController::formulaireRechercherBouteillesAction")) }}

            </div>
            <div class="tab-pane fade" id="membre" role="tabpanel" aria-labelledby="membre-tab">
                {{ render(controller("App\Controller\MembreController::formulaireRechercherMembresAction")) }}
            </div>
            <div class="tab-pane fade" id="pointDeVente" role="tabpanel" aria-labelledby="pointDeVente-tab">
                   {{ render(controller("App\Controller\PointDeVenteController::formulaireRechercherPointDeVenteAction")) }}
            </div>
        </div>
    </div>

谢谢，艾玛

答案

如果你把纯文本而不是{{ render(controller) }}文本，你有同样的问题吗？

像“Bouteille”，“Membre”和“Point de vente”。如果您仍然遇到这种情况，那么您应该更接近引导标记并相应地进行调整。如果这仍然不起作用，可能是在页面上没有正确加载bootstrap javascript