Phenquestions
Vue.js je univerzální a plnohodnotný rámec pro vytváření obrovských webových aplikací. Jakákoli webová aplikace je rozdělena na Komponenty. Například jednoduchý web, který obsahuje záhlaví, postranní panel a některé další komponenty. Za účelem správy a zpracování tohoto přístupu založeného na komponentách, Vue.js nabízí vztah rodič-dítě mezi komponentami a pokud chceme posílat některá data napříč komponentami. Vue.js nabízí rekvizity pro odesílání dat z nadřazeného prvku do podřízené komponenty, ale pro odesílání dat z podřízeného prvku nadřazenému; musíme vydávat vlastní události. V tomto článku se dozvídáme o spouštění a poslechu vlastních událostí.Nejprve se podívejme, jak ve Vue spustit vlastní událost.js a pak, jak si tuto událost vyslechnout. Syntaxe pro spuštění události ve Vue.js je
tento.$ emit ('eventName')V této syntaxi musíme být opatrní při pojmenovávání události, protože používáme stejný název; později si tuto událost vyslechneme. Abychom si tuto událost mohli poslechnout, můžeme ji poslouchat při poslechu události kliknutí ve Vue.js. Například
Můžeme zapsat libovolný výraz v obrácených čárkách i funkci. Zkusme tedy příklad, abychom tomu lépe porozuměli.
Příklad
Předpokládejme, že máme komponentu nazvanou „parentComponent“, která do ní zahrnuje podřízenou komponentu se jménem „childComponent“, které předáváme zprávu pomocí rekvizit.
Nadřazená součást
Podřízená součást
V podřízené komponentě dostáváme rekvizity a zobrazujeme zprávu ve značce „p“.
msg
Nyní po nastavení těchto dvou komponent. Řekněme ahoj zpět k naší ParentComponent. Abychom mohli pozdravit zpět, nejprve vytvoříme tlačítko a po kliknutí na toto tlačítko zavoláme funkci „helloBack“. Po vytvoření tlačítka by HTML podřízené komponenty vypadalo takto
zpráva
Vytvořme také funkci „helloBackFunc“ v objektu metod. Ve kterém vydáme „helloBackEvent“ spolu s proměnnou „helloBackVar“, která obsahuje řetězec „Hello Parent“. Po vytvoření funkce by byl javascript podřízené komponenty takový
Ukončení akce jsme skončili. Nyní přejdeme k nadřazené komponentě pro poslech události.
V nadřazené komponentě můžeme jednoduše poslouchat událost, stejně jako posloucháme událost kliknutí. Jednoduše budeme poslouchat událost ve značce ChildComponent a zavoláme na ni funkci „thanks ()“.
Ve funkci thanks přiřadíme předaný řetězec proměnné s názvem „thanksMessage“. Po vytvoření funkce a přiřazení předaného řetězce k proměnné by javascript „parentComponent“ vypadal takto
A svázat proměnnou „thanksMessage“ v šabloně někde, abyste viděli, zda to funguje, nebo ne.
Nadřazená součást
thanksMessage
Podřízená součást
Po vytvoření a napsání tohoto kódu přejděte na webovou stránku a znovu ji načtěte, abyste získali nejnovější funkce.
Vidíme, že rekvizity jsou úspěšně přeneseny do podřízené komponenty. Nyní, když klikneme na tlačítko, které je ve skutečnosti v podřízené komponentě. Zpráva s poděkováním by se měla zobrazit hned za nadpisem nadřazené součásti.
Jak vidíte, je zobrazen.
Takto můžeme emitovat nebo aktivovat vlastní události a poslouchat je v nějaké jiné komponentě ve Vue.js.
souhrn
V tomto článku jsme se naučili vydávat vlastní události ve Vue.js. Tento článek obsahuje krok za krokem správný příklad, jak jej pochopit, spolu se stručným vysvětlením. Doufáme tedy, že tento článek pomůže s lepšími a jasnějšími koncepty vysílání vlastních událostí ve Vue.js. Další užitečný obsah naleznete na linuxhint.com
