Lighting:tabset rendering tabs in "more" drop down when tabs are populated dynamically even though it has enough space to display all tabs

Salesforce Asked on December 18, 2020

My expected result should be, all tabs display in one line with out “more” option by using dynamic code.

When i tried dynamic code, Tabset displays only 3 names and rest of them in more option as show below even though it has enough space to display all values.
enter image description here

Below is the code.

   <!-- Dynamic, but displays on 3 tabs and more option for other tabs -->
         <aura:iteration items="{!v.systemNames}" var="sys">
               <lightning:tab label="{!sys}" id="{!sys}"/>

When i hard code the same list in component itself, all of them are displaying as expected.
enter image description here


     <!-- Hard coded the names to display all of them in one set -->
      <lightning:tab label="AMBPL" id="AMBPL"/>
       <lightning:tab label="AUGPL" id="AUGPL"/>
       <lightning:tab label="CLVNR" id="CLVNR"/>
       <lightning:tab label="DELTA" id="DELTA">

One Answer

Perhaps it behaves better if all possible tabs are available at init time. Try wrapping the whole thing inside an aura:if that doesn't render until the list is fully available.

Answered by Charles T on December 18, 2020

Add your own answers!

Ask a Question

Get help from others!

© 2024 All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP