Mam obowiązek wywoływać funkcję kontrolera podrzędnego z kontrolera nadrzędnego za każdym razem, gdy zdarzenie występuje po stronie nadrzędnej .
na przykład
ABC jest komponentem nadrzędnym, a DCE jest komponentem potomnym, ten komponent potomny ma znacznik Span of Text i symbol X. kiedy klikam x, czyści wartość za pomocą kontrolera podrzędnego. Komponent macierzysty ABC ma element Form, a komponent potomny jest jednym z elementów w formularzu.
Moim wymaganiem jest wyczyszczenie wartości tego komponentu potomnego po kliknięciu przycisku komponentu nadrzędnego.
Tutaj jest poniżej przykładowy kod tego, co próbuję, ponieważ nie mogę tutaj umieścić rzeczywistego kodu
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); } })
Komentarze
- Jeśli nie dostarczysz kodu, trudno ci pomóc.
- Mohit, dodał kod, którego nie mogę opublikować mojego oryginalnego kodu, ale podałem próbkę, co próbowałem osiągnąć.
Odpowiedź
Nazwa modułu obsługi w komponencie podrzędnym powinna być zgodna z zarejestrowaną nazwą w komponencie nadrzędnym. tj. procedura obsługi w komponencie potomnym powinna wyglądać następująco:
<aura:handler name="clrValues" event="c:ClearValues" action="{!c.clear}"/>
–UPDATE –
Myślę, że lepszym podejściem do komunikacji rodzic-dziecko jest użycie <aura:method>
zgodnie z opisem w lightning docs i tutaj
Aby to zrobić, należy zdefiniować metodę w komponent potomny w ten sposób:
<aura:method name="sampleMethod" action="{!c.clear}" access="PUBLIC">
Powinieneś wtedy mieć identyfikator, kiedy odsyłasz go do komponentu nadrzędnego w następujący sposób:
<c:ChildComponent textValue="test" aura:id="cComp"/>
Następnie w przejrzystej metodzie komponentu nadrzędnego należy wywołać metodę potomną w następujący sposób:
var childCmp = component.find("cComp") childCmp.sampleMethod();
Komentarze
- Dotyczy tylko zdarzenia na poziomie komponentu, a nie zdarzenia aplikacji.
- hmm that ' s prawda. Nie ' nie zauważyłem, że jest to zdarzenie aplikacji. @Raj_SFDC, dlaczego ' t możesz ustawić swoje wydarzenie jako zdarzenie składowe?
Odpowiedź
Moduł obsługi zdarzeń aplikacji nie powinien zawierać atrybutu name
, tylko event
i action
jest wystarczający, jak wspomniano tutaj .
Oto jak zdarzenie aplikacji powinno zostać wywołane w Twojej metodzie Clear:
({ clear : function(component, event, helper) { $A.get("e.c:clrValues").fire(); } })
Aby uzyskać więcej informacji, zapoznaj się z sekcją dotyczącą zdarzenia aplikacji w dokumencie .
Komentarze
- Z tym też nie powodzenia, przypuszczam, że nie możemy obsłużyć zdarzenia w dziecku rodzica. proszę potwierdzić
- @Raj_SFDC możemy odpalić zdarzenie aplikacji od rodzica do dziecka. W związku z tym robisz źle. Zaktualizowałem moją odpowiedź, spójrz na nią.
- Mam tutaj jedno pytanie z góry [$ A.get (" ec: clrValues ")], jak uzyskać wartość atrybutu.
- czy odnosisz się do parametrów zdarzenia? jeśli tak, możesz ustawić je za pomocą
$A.get("e.c:clrValues").setParams({'message':'test'})
i uruchomić zdarzenie, a następnie w metodzie obsługi możesz użyć$A.get("e.c:clrValues").getParam('message')
, aby odzyskać wartość.