Getting the values in Apex class but not in lightning component - Salesforce Globe For You

Getting the values in Apex class but not in lightning component - Salesforce Globe For You

Problem: When using wrapper class, the wrapper variable data is shown in debug logs of apex but in LWC component ,the data is not shown.

Solution: When using wrapper class,even the wrapper variables needs to be @AuraEnabled annotation as shown below

public class PersonData {

    @AuraEnabled public string name {get;set;}

    @AuraEnabled public String id {get;set;}

}

Example:

Apex Class: DisplayDataController

public class DisplayDataController {

    @AuraEnabled

    public static List<PersonData> fetchData() {

        List<PersonData> lstPersonData = new List<PersonData>();

        for(integer i =0; i<2; i++) {

            PersonData objPersonData = new PersonData();

            integer j= i+1;

            objPersonData.id = '00'+j;

            objPersonData.name = 'Test '+j;

            lstPersonData.add(objPersonData);

        }

        return lstPersonData;

    }

    public class PersonData {

        @AuraEnabled public string name {get;set;}

        @AuraEnabled public String id {get;set;}

    }

}

displayData.html

<template>

    <lightning-Card title="Person Data">

        <div>

            <lightning-datatable

                    key-field="id"

                    data={lstPerson}

                    columns={columns}>

            </lightning-datatable>

        </div>    

    </lightning-Card>

</template>

displayData.js

import { LightningElement,track } from 'lwc';

import personData from '@salesforce/apex/DisplayDataController.fetchData';

const columns = [

    { label: 'id', fieldName: 'id' },

    { label: 'name', fieldName: 'name'}

    

];

export default class DisplayData extends LightningElement {

    @track lstPerson;

    @track columns = columns;

    connectedCallback() {

        personData().then(result => {

            this.lstPerson = result;

            console.log('lstPerson',result);

        })

        .catch(error => {

            this.error = error;

        });

    }

}

displayData.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>

<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">

    <apiVersion>51.0</apiVersion>

    <isExposed>true</isExposed>

    <targets>

        <target>lightning__RecordPage</target>

        <target>lightning__AppPage</target>

        <target>lightning__HomePage</target>

    </targets>

</LightningComponentBundle>

Output: