How to display toast message on record opening

Question

Below is the toast component that will be displayed on button click on record page

Component:

<aura:component implements="force:hasRecordId,force:appHostable,flexipage:availableForAllPageTypes">
    <aura:attribute name="record" type="Map" default="{}" />
    <aura:attribute name="disabled" type="Boolean" default="true" />
    <aura:html tag="style">.toastMessage.forceActionsText{white-space : pre-line !important;}</aura:html>

    <force:recordData targetFields="{!v.record}"
        recordId="{!v.recordId}"
        recordUpdated="{!c.recordLoaded}"
        fields="Alert_Text_Timeline__c" />
    <div>
        <lightning:card>
            
   &nbsp;&nbsp; <strong><b> Important Alert: </b></strong>  <lightning:button label="Please click here"
                          variant="brand"
                          disabled="{!v.disabled}" 
                          onclick="{!c.showInfo}"/></lightning:card>
        
    </div> 
</aura:component>

JS:

({
    recordLoaded: function(component, event, helper) {
        component.set("v.disabled", false);
    },
    showInfo : function(component, event, helper) {
        var record = component.get("v.record");
        var toastEvent = $A.get("e.force:showToast");
        toastEvent.setParams({
            
            message: record.Alert_Text_Timeline__c,
            duration:' 5000',
            key: 'info_alt',
            type: 'info',
            mode: 'dismissible'           
        });
        toastEvent.fire();
    }
})

Now is there any way that i can display this automatically on record open instead of button click. Please suggest

Answer 1

Just call the showInfo function from recordLoaded. It will fire as soon as the force:recorddata loads the record (which should be almost instantly).

Do not use init handler because the data is not loaded yet when it fires.

PS. You may need to use a flag to avoid showing the toast again after the record is updated. Something like:

recordLoaded: function(component, event, helper) {
    if(!component.get("v.disabled")) {
        helper.showInfo(component);
        component.set("v.disabled", true);
    }
},