Outline: aura component controller is creating a LWC component (data-table) inside of a created tab: aura js:

    viewContent : function(component, event) {
        console.log('viewContent invoked');
        try {
            var viewerID = component.get('v.tvId')
            var tab = event.getSource();
            var tabLabel = tab.get("v.id");
            console.log('%c%s', 'color: #e711cb', 'viewContent: tabLabel (v.id): ', tabLabel);

            $A.createComponent("c:dynamicLWCDataTableController", {
                objRecId: tabLabel,
                }, function (newContent, status ,error) {
                    if (status === "SUCCESS") {
                        console.log('viewContent Success');
                        tab.set('v.body', newContent);
                    } else {
                        console.log('viewContent error: ' + error);
                        throw new Error(error);
        } catch (e) {
            console.log('Error in viewContent: ' + e);

This gets caught by the LWC controller JS:

    export default class Dynamic_LWC_Data_Table extends LightningElement {
        @track DataTableResponseWrappper;
        @track finalSObjectDataList;
        @api objRecId;
        @wire(getDynamicTableDataList, {TableName: this.objRecId})
        wiredContacts({ error, data }) 
            try {
                console.log('%c%s', 'color: #2703f3', 'lwc objRecId: ', this.objRecId);
            } catch (e) {
                console.log('Error with console log: ' + e);
            if(data) {
               console.log('lwc data option invoked');
               console.log('%c%s', 'color: #e50000', JSON.stringify(data));
    /// various data transform or assignment code instructions from here ...

and the LWC HTML, which naturally loads first tries to immediately read this:

    <div if:true={DataTableResponseWrappper}>
                        <div class="slds-text-heading_small">{DataTableResponseWrapper.TableTitle}</div>
                        <lightning-datatable data={finalSObjectDataList} 

Problem is in execution: the objRecId is undefined, eventually showing up. At this point nothing else happens because it is not wired so not necessarily reactive upon change.

Changing the Table Name to a hard coded TableName:

    @wire(getDynamicTableDataList, {TableName: 'Example_Tabel'})

I get an initial undefined on the objRecId along with an error from HTML showing it cannot read the object and on the returning wrapper object, then a moment it later it auto-updates and the console log shows both the objRecId and the object but the HTML does not refresh so I do not get the table loaded.

I can think of a few possible solutions but have been encouraged to find a gold class solution to this issue so any assistance would be appreciated.
Ideal world:

  • Enough of a delay for objRecId to load up and be used
  • A delay or other solution to get the table loaded after the wrapper object has been delivered

1 Answer 1


You just need to make the property reactive:

@wire(getDynamicTableDataList, {TableName: '$objRecId'})

Now that your wire handler will be called at least twice, once with no data, and once with the provisioned data.

  • Made the change back to the $objRecId format. Unfortunately it continues to exhibit the same behaviour. Highlights from my console log shows the full object as happy as I can be followed by - Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'TableTitle') And for the record TabeTitle is perfectly readable if it has the object in question. I checked that. I've also been playing with <apexRefresh> with no real result. Currently considering pre-loading the data and sending it along with CreateComponent that makes the datatable though that seems extreme.
    – sfBruce
    Dec 20, 2021 at 23:36
  • @sfBruce Without more context, it's hard to say, but the reactive feature is the intended path. See the documentation on this. Make sure your variable names are correctly case-matching (JS is notoriously case sensitive), and make sure the parameter names match, etc. Your template looks right, as the outer if:true should block the inner parts from rendering.
    – sfdcfox
    Dec 20, 2021 at 23:59
  • Thank you for looking it over and making suggestions. I'm sticking with the reactive rather than this. and going over everything. Got a $10 bill says it's a param or typo and I've been staring at it for so long I can't see it anymore. I'll give it a couple days to see if anyone happens to figure it out but if I get it figured out before that or no other suggestions forthcoming, I'll mark you up for correct as it was helpful.
    – sfBruce
    Dec 21, 2021 at 17:37

You must log in to answer this question.

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