I'm attempting to build a accordion where all the contacts under each Account drill down like an accordion. I referred salesforce documentation.

<lightning-card  title="Accounts with Contacts">
    <lightning:accordion aura:id="accordion" >
    <template if:true={accounts}>
        <template for:each={accounts} for:item="account">
            Account - {account.Name}
            <lightning:accordionSection key={account.id} name="A" label="Accordion Title A">
                <aura:set attribute="body">
                    <template for:each={account.Contacts} for:item="co">
                       <p key={co.Id}> Contact - {co.Name}</p>



public class FetchMultipleRecords {

public static List<Account> search() {
return [SELECT Id,Industry, Name ,Type,(SELECT id, Name FROM contacts) FROM 
 Account LIMIT 2];        

My results shows only Accounts without contacts. If I remove the accordion, I get both accounts and contacts together.

Let me know if I'm building it the wrong way.

  • this Account - {account.Name} should probably be put into the accordion section label. label="Accordion Title A" looks like it was copy/pasted from the example.
    – gNerb
    Commented Feb 13, 2020 at 22:13
  • Also, I don't think that aura:set is valid for the given context. Docs You should check out slots. The accordion only has actions and default slots.
    – gNerb
    Commented Feb 13, 2020 at 22:15

1 Answer 1


You can't use Aura components in LWC. You'll know you're trying to use an Aura component because it'll have a : in it. For example, lightning:accordion is an Aura component, while lightning-accordion is an LWC component. You'll need to look at the correct documentation to get the correct syntax. The same is also true for lightning:accordionSection versus lightning-accordion-section.

  • I was able to achieve, with the correct documentation
    – MnZ
    Commented Jun 10, 2021 at 2:13

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .