Efter min erfaring kender de fleste studerende dette koncept. Hvis du ikke ved meget, skal du vide, at browseren vil udløse en onload-hændelse, når en webside indlæses, og vi bruger normalt $(document).load()-metoden i window.onload eller jquery til at definere, hvad en webside skal gøre, når den indlæses.
I en APP er denne slags begivenhed mere rig. Mange gange skal man gøre noget for brugerne, før de ser siden, det mest almindelige er at hente data fra serveren; Eller gør noget, når de er ved at forlade en side.
1. Forstå den ioniske livscyklus-krog
Fra og med Ionic 3.8.0 tilbyder frameworket 8 hook-funktioner, der udløses på forskellige stadier af sidens livscyklus.
1.1 ionViewDidLoad
Triggeren for sideindlæsningsfuldførelse, her refererer "load complete" til den status på siden, hvor de nødvendige ressourcer er indlæst, men endnu ikke er indtastet i sidens tilstand (brugeren ser stadig den forrige side).
Det skal bemærkes, at det er en meget arrogant krog, som kun bliver kaldt én gang i hele processen, det vil sige, at den kaldes, når du går ind på siden første gang, og efter det, uanset hvordan du går ind og ud, vil den være øde og elendig. Medmindre du slukker dens baggrund og genindtaster softwaren (det er også okay at trykke på opdater, mens websiden fejlfindes).
Derfor er denne hook egnet til at udføre engangsbehandling, såsom at hente brugerdata fra serveren og gemme dem i cachen.
1.2 ionViewWillEnter
Den bogstavelige forståelse er øjeblikket "jeg kommer ind", hvor siden bare begynder at skifte. Du kan forbehandle sidens data på dette tidspunkt, og denne hook vil blive kaldt hver gang.
1.3 ionViewDidEnter
Når denne hook udløses, har brugeren indtastet en ny side (siden er aktiv), og den vil blive kaldt hver gang.
Når vi taler om det, må jeg indskyde, Ionics navngivning af kroge er virkelig venlig over for størstedelen af kinesiske studerende, og én vil og én LØSTE problemet. I modsætning til nogle glamourøse (forkerte) frameworks udenfor, er der en masse ready, update, complied, destory osv., husk én gang og glem én gang. (Selvfølgelig er dette en joke, navngivningen af komponenter er tæt forbundet med rammeværkets driftsmekanisme)
1,4 ionVilVilForlade
Page Ready (er ved at gøre det) aktiveres, når brugeren netop har aktiveret tilbage-knappen eller en relateret begivenhed.
1.5 ionViewDidLeave
Udløst, når siden er færdig, er siden inaktiv.
1,6 ionViewWillUnload
Udløses, når en ressource på en side er ved at blive ødelagt, ville du gætte på, at denne hook, ligesom ionViewDidLoad, kun bliver udløst én gang?
1.7 Testning
Lad os tage siden, vi lavede i forrige afsnit, og lave en test af indlæsningen af krogen.
I det forrige afsnit implementerede vi processen med at hoppe fra HomePage til TestPage ved hjælp af knapper, og nu tilføjer vi ovenstående seks hooks til TestPage og observerer deres påkaldelse gennem konsollen.
Sidetemaets sektionskode er som følger
Bemærk, at jeg også tilføjede en testsætning til konstruktøren. Åbn Serve-fejlsøgning, klik på knappen, gå til TestPage, og observer, hvad konsollen sender.
Første gang på siden
Gå tilbage til forsiden og se, hvad konsollen sender.
At forlade siden for første gang
Indtast og forlad TestPage igen og observer, hvad konsollen outputter.
Anden ind- og udgang
Følgende konklusioner kan drages:
- Konstruktøren affyres før ionViewDidLoad
- ionViewDidLoad aktiveres kun, når du først går ind på siden
- ionViewWillUnload udløses efter hver gang, du forlader siden
2. Der er også to guard hooks
Jeg nævnte i starten, at ionisk har 8 kroge, mens jeg kun introducerede 6. De første 6 hooks har en fællesnævner, og deres returværdier er alle void, det vil sige, de kaldes på det tilsvarende tidspunkt og returnerer ingen information.
De to andre hooks er lidt forskellige, de er ionViewCanEnter og ionViewCanLeave, som kan returnere booleans.
Se, jeg har lige talt om tider, og nu vil jeg tale om modale verber. Hvis de første 6 hooks er en passiv reaktion fra siden på brugerens besøg, så har siden nu bevidstheden til at lade dig komme eller lade dig gå, ah, siden har stået op fra nu af!
Disse to kroge spiller en større rolle i autoritetskontrol, og for nylig findes der et meget trendy udtryk kaldet Vagt; hvordan man forstår denne vagt, kan du forstå den som portvagten for samfundet, den venlige skoleleder og den gamle trappe 2333 med tusindvis af positurer i den gamle abrikosblomstbygning.
Nu hvor vi allerede ved, at den returnerer en boolsk værdi, lad os prøve det. Fordi der ikke er nogen forretningslogik i vores program, lad os bruge et tids-API til at bedømme her
Adgangen til siden er blokeret
Tilsvarende, hvis du vil lade være på en side, og ionViewCanLeave returnerer false, vil du blive blokeret.
Returoperationen bliver opsnappet
Konsoludskrevet information
3 Resumé
Ahem, ikke mere pjat, for at opsummere har Ionic følgende livscyklus-kroge
- ionViewDidLoad kaldes første gang for at returnere void
- ionViewWillEnter returnerer void hver gang den kaldes
- ionViewDidEnter returnerer void hver gang den kaldes
- ionViewWillLeave returnerer void hver gang den kaldes
- ionViewDidLeave returnerer void hver gang den kaldes
- ionViewWillUnload returnerer void hver gang den kaldes
- ionViewCanEnter returnerer boolean hver gang den kaldes
- ionViewCanLeave returnerer boolesk hver gang den kaldes
|
Opslået på 21/06/2018 10.30.06
|
|
|
|
