1

Everything was working fine with this component a couple days ago. Then I added an event and now I'm getting a strange error:

Uncaught Component class instance initialization error [Cannot read property 'g' of undefined] Callback failed: serviceComponent://ui.flexipage.components.page.FlexipageControllerV2/ACTION$getPage

function: a.H.wd

Markup:

<aura:component implements="flexipage:availableForAllPageTypes" controller="QuestionViewerController" >

<aura:handler name="init" value="{!this}" action="{! c.doInit }"/>
<aura:handler name="QuestionAddedEvent" value="{!this}" action="{! c.reloadQuestions }"/>

<aura:attribute name="title" type="String" required="true" default="Question Viewer"/>
<aura:attribute name="Questions" type="Question__c[]"/>
<aura:attribute name="currentQuestion" type="Question__c"/>
<aura:attribute name="index" type="Integer" />
<aura:attribute name="bodyEmpty" type="Boolean"/>

<lightning:card title="{!'Question: ' + v.currentQuestion.Name}" class="slds-p-horizontal_medium">
    <div class="slds-grid--verticle">
        <div class="slds-col slds-no-flex">

            <aura:if isTrue="{! v.bodyEmpty }">
                    <lightning:formattedText class="slds-text-heading_medium slds-no-flex" title="{!v.currentQuestion.Name}" value="{!v.currentQuestion.Explanation__c}"/>
                <aura:set attribute="else">
                    <lightning:formattedText class="slds-text-heading_medium slds-no-flex" title="{!v.currentQuestion.Name}" value="{!v.currentQuestion.body__c}"/>    
                </aura:set>
            </aura:if> 

        </div>
        <div class="slds-p-top_medium slds-p-bottom_medium">
            <lightning:formattedText aura:id="answer" class="slds-text-heading_small slds-no-flex slds-hide slds-box" value="{! v.currentQuestion.answer__c }"/>
        </div>
        <div class="slds-col slds-no-flex slds-theme_info">
            <button class="slds-button" onclick="">
                <lightning:icon iconName="action:back" size="small" alternativeText="Do something" />
            </button>

            <button class="slds-button" onclick="">
                <lightning:icon iconName="action:delete" size="small" alternativeText="Do something" />
            </button>

            <button class="slds-button" onclick="{! c.createQuestion }">
                <lightning:icon iconName="action:flow" size="small" alternativeText="Do something" />
            </button>

            <button class="slds-button" onclick="{! c.showAnswer }">
                <lightning:icon iconName="action:new_campaign" size="small" alternativeText="Do something" />
            </button>

            <button class="slds-button" onclick="{! c.nextQuestion }">
                <lightning:icon iconName="action:refresh" size="small" alternativeText="Do something" />
            </button>

            <lightning:formattedText class="slds-p-horizontal_small" value="{! v.currentQuestion.Category__c }" />
        </div> 
    </div>
</lightning:card>

client side controller, I'm pretty sure it has to do with the init method because It says 'component initialization':

doInit : function(component, event, helper) {
    var questionlist = component.get("c.getQuestionList");
    questionlist.setCallback(this, function(response){
        var state = response.getState();

        if(state == "SUCCESS"){
            component.set("v.Questions",response.getReturnValue());
        } 

    });

    component.set("v.index",0);

    $A.enqueueAction(questionlist);
},

apex controller:

public class QuestionViewerController {

@AuraEnabled
public static List<Question__c> getQuestionList(){
    return [Select id,body__c,answer__c,Name,Type__c,Explanation__c,Category__c From Question__c];
}
}
5

Looks like your event handler declaration is causing the problem.

<aura:handler name="QuestionAddedEvent" value="{!this}" action="{! c.reloadQuestions }"/>

You should not be using value="{!this}", as this would try to handle component initialisation. I am guessing it is conflicting with you doInit handler throwing the error. There must be only one aura:valueInit event for a given component.

Reference : https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/ref_aura_valueInit.htm

That being said , the handler "QuestionAddedEvent" does not mention which event you are handling , It must ideally take an event=""attribute to let know which event you are handling in the action.

Something like the following

<aura:handler name="QuestionAddedEvent" event="ns:compEvent" action="{!c.handleComponentEvent}"/>

This also makes sense why your component stopped working as soon as this handler was introduced.

3

Looks like the issue is with the syntax for event handler .

Closely re examine the below lines of code

<aura:handler name="QuestionAddedEvent" value="{!this}" action="{! c.reloadQuestions }"/>

Binding this function as value is applicable only for the init event .

Note that for application event the handler would have the syntax has below

<aura:handler event="c:QuestionAddedEvent" action="{!c.reloadQuestions}"/>

This assumes you have defined an application event file with name reloadQuestions

For Component event the below is the format

<aura:handler name="QuestionAddedEvent" event="c:QuestionAddedEvent"
action="{!c.reloadQuestions}"/>
  • Looks like we posted simultaneously. – StormBr34ker Dec 30 '17 at 7:07

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.