3

So I am creating a LWC, but when I add this to the App Builder the component doesn't render and when refreshing the app builder I get the following error

This page has an error. You might just need to refresh it. Failed to initialize a component [Cannot read property 'recordId' of undefined]

The meta data looks like:

    <isExposed>true</isExposed>
    <masterLabel>Case Details</masterLabel>
    <targets>
        <target>lightningCommunity__Page</target>
        <target>lightningCommunity__Default</target>
        <target>lightning__RecordPage</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__RecordPage">
            <objects>
                <object>Case</object>
            </objects>
        </targetConfig>
        <targetConfig targets="lightningCommunity__Default">
            <property name="recordId" type="String" ></property>
        </targetConfig>
    </targetConfigs>

and the JS file looks like this:

    @api recordId;
    @track subject;
    @track description;
    @track priority;

    @wire(getRecord, {
        recordId: this.recordId,
        fields: [CASE_SUBJECT, CASE_DESCRIPTION, CASE_PRIORITY],
        optionalFields: [ACCOUNT_NAME, CONTACT_NAME, CONTACT_PHONE]
    }) wireuser({
        error,
        data
    }) {
        if (error) {
           this.error = error ; 
        } else if (data) {
            this.subject = data.fields.Subject.value;
            this.description = data.fields.Description.value;
            this.priority = data.fields.Priority.value;
        }
    }

I have looked through many documents and comments, but haven't figured this out. any help is much appreciated.

3

The issue was a syntax error in my .js file where I had this.recordId instead of '$recordId'

Final code in .js file

    @api recordId;
    @track subject;
    @track description;
    @track priority;

    @wire(getRecord, {
        recordId: '$recordId',
        fields: [CASE_SUBJECT, CASE_DESCRIPTION, CASE_PRIORITY],
        optionalFields: [ACCOUNT_NAME, CONTACT_NAME, CONTACT_PHONE]
    }) wireuser({
        error,
        data
    }) {
        if (error) {
           this.error = error ; 
        } else if (data) {
            this.subject = data.fields.Subject.value;
            this.description = data.fields.Description.value;
            this.priority = data.fields.Priority.value;
        }
    }

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.