2

I'm still getting an undefined serial even after removing the connectedCallback and using the wiredRecord function. Do you see what I'm missing? Sorry if its obvious I am very new to all of this.

import { LightningElement, track, api, wire } from 'lwc';//api, wire 

import { getRecord, getFieldValue } from 'lightning/uiRecordApi';

import { ShowToastEvent } from 'lightning/platformShowToastEvent';

//import field reference from schema import SERIAL_FIELD from '@salesforce/schema/Asset.Serial_Test__c';

const field = [SERIAL_FIELD];

export default class TestCallout extends LightningElement {

@track toDoData;
@track serial;
@api recordId;
@wire(getRecord, { recordId: '$recordId', fields: field})asset;


wiredRecord({error, data}){
    if (error) {
        let message = 'Unknown error';
        if (Array.isArray(error.body)) {
            message = error.body.map(e => e.message).join(', ');
        } else if (typeof error.body.message === 'string') {
            message = error.body.message;
        }
        this.dispatchEvent(
            new ShowToastEvent({
                title: 'Error loading contact',
                message,
                variant: 'error',
            }),
        );
    } else if (data){

    //make callout using fetch
    let serial = getFieldValue(this.asset.data, SERIAL_FIELD);

    fetch('https://jsonplaceholder.typicode.com/todos?id='+ serial, 
    //endpoint passes serial number from current sfdc record
    {
        // Request type
        method:"GET",

        headers:{
            // content type
            "Content-Type": "application/json",
        }
    })
    .then((response) => {    
        return response.json(); // returning the response in the form of JSON
    })
    .then((jsonResponse) => {

                    let objData = {
                        title : '',
                        completed : '',
                    };
                    window.console.log('jsonResponse ===> '+JSON.stringify(jsonResponse));
                    // retriving the response data
                    let jsonData = jsonResponse[0];

                    // adding data object
                    objData.title = jsonData.title; 
                    objData.completed = jsonData.completed;

                    // adding data object to show in UI
                    this.toDoData = objData;
                })
                .catch(error2 => {
                    window.console.log('callout error ===> '+JSON.stringify(error2));
                })


        } 

    }

}

2
  • 1
    One of the things I struggled with when first working lwcs is understanding that almost everything is Async. There's a chance that your callout is happening before the wire method is returning. This component shows a trick I used to help resolve timing issues (Around line 114). No idea if it is considered a best practice or not. – gNerb Feb 21 '20 at 19:00
  • @gNerb I made updates to my code to reflect your feedback but I'm still struggling to figure out why the serial number is undefined. Do you see any errors in my code? – J.Ro Feb 25 '20 at 19:23
2

2 things

1) The syntax for @getRecord is incorrect. It should be

@wire(getRecord, {recordId: '$recordId', fields: field})

2) The default value of wire variables will be present in lifecycle callbacks, thus connected callback does not have the serial field. See below excerpt from Salesforce

The property is assigned a default value after component construction and before any other lifecycle event. The default value is an object with data and error properties of undefined. Therefore, you can access the property’s value in any function, including functions used by the template or used as part of the component’s lifecycle.

Fix would be to use imperative getRecord

@wire(getRecord, { recordId: '$recordId', fields: FIELDS })
    wiredRecord({ error, data }) {
    if(data){
        //Do your fetch call
    }
}
1
  • Are you saying that I can remove the connectedCallback and add the code to the wiredRecord function and it will behave the same way. I need the data to update when the page is loaded and edited. Based on your feedback I made the updates to the above code. Am I doing it wrong I'm still not getting a defined serial number? – J.Ro Feb 25 '20 at 19:09

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.