Cum se apelează funcția controler component copil / asistent de la controler component părinte

Am obligația de a apela o funcție controlor copil de la controler părinte ori de câte ori evenimentul are loc în partea părinte .

de exemplu

ABC este componenta părinte și DCE este componenta copil, această componentă copil are eticheta de extindere a textului și simbolul X. când dau clic pe x, se șterge valoarea folosind controlerul copil. Componenta părinte ABC are element Form și componenta copil este una dintre forme.

Cerința mea este să șterg valoarea acestei componente copil atunci când se face clic pe butonul component părinte.

iată mai jos eșantion de cod a ceea ce încerc, deoarece nu pot posta codul real aici

ParentComponent.cmp

 <aura:registerEvent name="clrValues" type="c:ClearValues"/> <div> <c:ChildComponent textValue="test"/> <ui:button label="Save"/> <ui:button label="Clear" press="{!c.clear}"/> </div> </aura:component> 

ParentController.js

({ clear : function(component, event, helper) { var evtFire = component.getEvent("clrValues"); evtFire.fire(); } }) 

ClearValues.evt

<aura:event type="APPLICATION" description="Event template" /> 

ChildComponent.cmp

<aura:component > <aura:handler name="setValues" event="c:ClearValues" action="{!c.clear}"/> <aura:attribute name="textValue" type="String" default="test"/> <div > <ui:inputText label="Expense Name" value="{!v.textValue}" aura:id="input1"/> </div> </aura:component> 

ChildController.js

({ clear : function(component, event, helper) { helper.clearValues(component,event); } }) 

Comentarii

  • Cu excepția cazului în care furnizați codul, este greu să vă ajute
  • Mohit, a adăugat codul, nu pot posta codul meu original, dar am dat o mostră a ceea ce încercam să obțin.

Răspuns

Numele handlerului din componenta copilului dvs. trebuie să se potrivească cu numele înregistrat din componenta părinte. adică, handlerul din componenta copil ar trebui să fie astfel:

 <aura:handler name="clrValues" event="c:ClearValues" action="{!c.clear}"/> 

–UPDATE –

Cred că o abordare mai bună pentru comunicarea părinte-copil este utilizarea <aura:method> așa cum este listat în lightning docs și aici

Pentru a face acest lucru, ar trebui să definiți o metodă în componentă copil ca aceasta:

 <aura:method name="sampleMethod" action="{!c.clear}" access="PUBLIC"> 

Atunci ar trebui să aveți un id când îl referiți în componenta părinte astfel:

 <c:ChildComponent textValue="test" aura:id="cComp"/> 

Apoi, în metoda clară a componentei părinte, ar trebui să invocați metoda copil astfel:

 var childCmp = component.find("cComp") childCmp.sampleMethod(); 

Comentarii

  • Se aplică numai pentru evenimentul la nivel de componentă, nu pentru un eveniment de aplicație.
  • hmm that ' este adevărat. Nu am ' observat că acesta este un eveniment al aplicației. @Raj_SFDC, de ce ' nu poți face din evenimentul tău un eveniment component?

Răspunde

Application Event handler nu trebuie să conțină atributul name doar event și action atributul este suficient așa cum s-a menționat aici .

Acesta este modul în care un eveniment al aplicației ar trebui să fie declanșat în metoda dvs. clară:

({ clear : function(component, event, helper) { $A.get("e.c:clrValues").fire(); } }) 

Pentru mai multe informații, consultați secțiunea despre evenimentul aplicației din doc .

Comentarii

  • Nici un noroc cu asta, presupunerea mea este că nu putem gestiona evenimentul la copil de la părinte. vă rugăm să confirmați
  • @Raj_SFDC putem declanșa un eveniment al aplicației de la părinte la copil. Cu aceasta a spus, faceți greșit. Am actualizat răspunsul meu, vă rugăm să îl priviți.
  • Am o întrebare aici de mai sus [$ A.get (" ec: clrValues ")], cum se obține valoarea atributului.
  • vă referiți la parametrii evenimentului? dacă da, îl puteți seta utilizând $A.get("e.c:clrValues").setParams({'message':'test'}) și să declanșați evenimentul, atunci în metoda de gestionare puteți utiliza $A.get("e.c:clrValues").getParam('message') pentru a recupera valoarea.

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *