Ta članek je zrcalni članek strojnega prevajanja, kliknite tukaj za skok na izvirni članek.

Pogled: 12922|Odgovoriti: 0

[ionski] Dogodki življenjskega cikla ionic3 strani (kljuke)

[Kopiraj povezavo]
Objavljeno na 21. 06. 2018 10:30:06 | | | |
Po mojih izkušnjah večina študentov ta koncept pozna. Če ne veste veliko, potem morate vedeti, da brskalnik sproži dogodek nalaganja, ko se spletna stran naloži, in običajno uporabljamo metodo $(document).load() v window.onload ali jquery, da določimo, kaj naj spletna stran naredi ob nalaganju.



V aplikaciji je tak dogodek bogatejši. Velikokrat morate nekaj narediti za uporabnike, preden vidijo stran, najpogostejše je pridobivanje podatkov s strežnika; Ali pa naredi kaj, ko bodo zapustili stran.

1. Razumeti ionski življenjski cikel
Od Ionic 3.8.0 okvir ponuja 8 funkcij za zaklepe, ki se sprožijo v različnih fazah življenjskega cikla strani.

1.1 ionViewDidLoad
Sprožilec dokončanja nalaganja strani, tukaj "nalaganje končano", se nanaša na stanje strani, v katerem so bili potrebni viri naloženi, vendar še niso vstopili v stanje strani (uporabnik še vedno vidi prejšnjo stran).

Treba je poudariti, da gre za zelo aroganten hook, ki ga v celotnem procesu prikličete le enkrat, torej ga prikličete, ko prvič vstopite na stran, in potem, ne glede na to, kako vstopite in izstopite, bo ta prazna in nesrečna. Razen če ugasnete ozadje in ponovno vnesete programsko opremo (prav tako je v redu pritisniti osvežitev med odpravljanjem napak na spletni strani).

Zato je ta hook primeren za enkratno obdelavo, kot je pridobivanje uporabniških podatkov s strežnika in njihovo shranjevanje v predpomnilnik.

1.2 ionViewWillEnter
Dobesedno razumevanje je trenutek "Prihajam noter", ko se stran začne preklapljati. Na tej točki lahko predhodno obdelate podatke strani, ta kljuka pa se bo klicala vsakič.

1.3 ionViewDidEnter
Ko se ta kljuka sproži, uporabnik vnese novo stran (stran je aktivna) in bo klicana vsakič.

Ko smo že pri tem, moram dodati, da je poimenovanje kljuk v Ionicu res prijazno do večine kitajskih študentov, in ena bo rešila in druga RES rešila problem. Za razliko od nekaterih glamuroznih (napačnih) ogrodij zunaj je tu kup pripravljenih, posodobitev, skladov, odstranitev itd., enkrat si zapomni in enkrat pozabi. (Seveda je to šala, poimenovanje komponent je tesno povezano z mehanizmom delovanja ogrodja)

1.4 ionViewWillLeave
Page Ready (bo kmalu pripravljen) se sproži, ko uporabnik pravkar sproži gumb za nazaj ali povezan dogodek.

1.5 ionViewDidLeave
Ko se stran konča, je stran neaktivna.

1.6 ionViewWillUnload
Sprožilci, ko je vir na strani tik pred uničenjem, ali bi ugibali, da se ta kljuka, podobno kot ionViewDidLoad, sproži le enkrat?

1.7 Testiranje
Vzemimo stran, ki smo jo ustvarili v prejšnjem razdelku, in naredimo test nalaganja kljuke.
V prejšnjem razdelku smo implementirali postopek preskakovanja z domače strani na testno stran z uporabo gumbov, zdaj pa dodajamo zgornjih šest kljuk v TestPage in opazujemo njihovo sprožitev preko konzole.

Koda teme strani je naslednja

Upoštevajte, da sem dodal tudi testno izjavo konstruktorju. Odpri Serve za razhroščevanje, klikni gumb, pojdi na TestPage in opazuj, kaj konzola izpiše.


Prvič na strani

Vrni se na domačo stran in opazuj, kaj konzola izhodi.

Prvič zapustiti stran

Ponovno vstopite in zapustite TestPage ter opazujte, kaj konzola izpiše.

Drugi vstop in izstop

Iz tega lahko potegnemo naslednje zaključke:

  • Konstruktor se sproži pred ionViewDidLoad
  • ionViewDidLoad se sproži le, ko prvič vstopiš na stran
  • ionViewWillUnload se sproži vsakič, ko zapustite stran


2. Obstajata tudi dve stražni kljuki

Na začetku sem omenil, da ionic ponuja 8 kljuk, jaz pa sem uvedel le 6. Prvih 6 kljuk ima skupno lastnost, njihove povratne vrednosti pa so vse nične, torej so poklicane v ustreznem trenutku in ne vračajo nobene informacije.

Drugi dve kljuki sta nekoliko drugačni, to sta ionViewCanEnter in ionViewCanLeave, ki lahko vrneta booleanove vrednosti.
Poglej, pravkar sem govoril o časih, zdaj pa bom govoril o modalnih glagolih. Če je prvih 6 kljuk pasivni odziv strani na obisk uporabnika, potem ima stran zdaj zavest, da vam dovoli priti ali dovoliti, da odidete, ah, stran je od zdaj naprej pokonci!

Ti dve kljuki imata večjo vlogo pri nadzoru oblasti, nedavno pa se pojavi zelo moderen izraz Straža, kako razumeti to stražo, lahko jo razumete kot vratar skupnosti, prijazni ravnatelj in starega dropa 2333 s tisoči držami v starodavni stavbi cvetov marelice.

Zdaj, ko že vemo, da vrne boolovo vrednost, poskusimo. Ker v našem programu ni poslovne logike, uporabimo časovni API za presojo


Dostop do strani je blokiran


Podobno, če želite oditi na strani, če ionViewCanLeave vrne laž, boste blokirani.


Povratna operacija je prestrežena


Tiskane informacije na konzoli

3 Povzetek

Ahem, dovolj neumnosti, za povzetek, Ionic ima naslednje življenjske refrene

  • ionViewDidLoad se pokliče prvič, da se vrne void
  • ionViewWillEnter vsakič, ko je klic, vrne nično
  • ionViewDidEnter vrne void vsakič, ko je klic poklican
  • ionViewWillLeave vrne nično vsakič, ko je poklican
  • ionViewDidLeave vsakič, ko je klic poklican, vrne ničen
  • ionViewWillUnload vrne void vsakič, ko ga pokličemo
  • ionViewCanEnter vrne boolean vsakič, ko ga pokličemo
  • ionViewCanLeave vrne boolean vsakič, ko ga pokličemo






Prejšnji:Ionic Development Android App Practice (3): Seznam novic Video
Naslednji:Ponudnik ionic3
Disclaimer:
Vsa programska oprema, programski materiali ali članki, ki jih izdaja Code Farmer Network, so namenjeni zgolj učnim in raziskovalnim namenom; Zgornja vsebina ne sme biti uporabljena v komercialne ali nezakonite namene, sicer uporabniki nosijo vse posledice. Informacije na tej strani prihajajo z interneta, spori glede avtorskih pravic pa nimajo nobene zveze s to stranjo. Zgornjo vsebino morate popolnoma izbrisati z računalnika v 24 urah po prenosu. Če vam je program všeč, podprite pristno programsko opremo, kupite registracijo in pridobite boljše pristne storitve. Če pride do kakršne koli kršitve, nas prosimo kontaktirajte po elektronski pošti.

Mail To:help@itsvse.com