Vue.JS emituj niestandardowe zdarzenia

Vue.JS to wszechstronna i pełnoprawna ramy do budowania ogromnych aplikacji internetowych. Każda aplikacja internetowa jest podzielona na komponenty. Na przykład prosta strona internetowa, która zawiera nagłówek, pasek boczny i niektóre inne komponenty. W celu zarządzania tym podejściem opartym na komponentach, Vue.JS oferuje związek rodzic-dziecko między komponentami i jeśli chcemy wysłać niektóre dane w komponentach. Vue.JS oferuje rekwizyty do wysyłania danych z rodzica do komponentu dziecięcego, ale wysyłanie danych od dziecka do rodzica; Musimy emitować niestandardowe zdarzenia. W tym artykule dowiadujemy się o strzelaniu i słuchaniu niestandardowych wydarzeń.Po pierwsze, zobaczmy, jak zwolnić niestandardowe wydarzenie w Vue.JS, a następnie jak słuchać tego wydarzenia. Składnia do strzelania w Vue.JS to to.$ emit („eventName”)

W tej składni musimy zachować ostrożność, podając nazwę zdarzenia, ponieważ używając tej samej nazwy; Później wysłuchamy tego wydarzenia. Aby wysłuchać tego wydarzenia, możemy go wysłuchać, słuchając wydarzenia kliknięcia w Vue.JS. Na przykład

Możemy napisać dowolne wyrażenie w odwróconych przecinkach, a także funkcji. Spróbujmy więc przykładu, aby lepiej go zrozumieć.

Przykład

Załóżmy, że mamy komponent o nazwie „ParentComponent”, który zawiera w nim komponent dziecięcy o imieniu „Childcomponent”, do którego przekazujemy wiadomość za pomocą rekwizytów.

W komponencie dziecka otrzymujemy rekwizyty i pokazujemy wiadomość w znaczniku „p”.

Teraz po skonfigurowaniu tych dwóch komponentów. Przywitajmy się z naszym nadrzędnym komponentem. Aby się przywitać, najpierw utworzymy przycisk, a przy kliknięciu tego przycisku nazwiemy funkcję „Helloback”. Po utworzeniu przycisku HTML komponentu dziecięcego byłoby tak

Utwórzmy funkcję „helloBackFunc” również w obiekcie metod. W którym wyemitujemy „HelloBackevent” wraz z zmienną „HelloBackvar”, która zawiera ciąg „Hello Parent”. Po utworzeniu funkcji JavaScript komponentu dziecięcego byłby taki

Skończyliśmy z wystrzeleniem wydarzenia. Teraz przejdźmy do komponentu nadrzędnego, aby wysłuchać wydarzenia.

W komponencie nadrzędnym możemy po prostu wysłuchać wydarzenia, tak jak słuchamy wydarzenia kliknięcia. Po prostu posłuchamy wydarzenia w tagu ChildComponent i wywołuje na niej funkcję „Thanch ()”.