Enligt min erfarenhet känner de flesta studenter till detta koncept. Om du inte vet så mycket måste du veta att webbläsaren kommer att utlösa en onload-händelse när en webbsida laddas, och vi brukar använda metoden $(document).load() i window.onload eller jquery för att definiera vad en webbsida ska göra när den laddas.
I en APP är den här typen av evenemang rikare. Ofta måste man göra något för användarna innan de ser sidan, det vanligaste är att hämta data från servern; Eller gör något när de är på väg att lämna en sida.
1. Förstå den joniska livscykelkroken Från och med Ionic 3.8.0 tillhandahåller ramverket 8 krokfunktioner som triggas vid olika stadier av sidlivscykeln.
1.1 ionViewDidLoad Triggern för sidladdningsfullbordan, här syftar "load complete" på det tillstånd på sidan där de nödvändiga resurserna har laddats men ännu inte har angett sidans tillstånd (användaren ser fortfarande föregående sida).
Det bör noteras att det är en mycket arrogant krok, som bara kommer att kallas en gång under hela processen, det vill säga den anropas när du går in på sidan för första gången, och efter det, oavsett hur du går in och ut, kommer den att vara öde och miserabla. Om du inte stänger av dess bakgrund och går in i programvaran igen (det är också okej att trycka på uppdatera medan du felsöker webbsidan).
Därför är denna hook lämplig för att du ska kunna göra viss engångsbearbetning, som att hämta användardata från servern och lagra den i cachen.
1.2 ionViewWillEnter Den bokstavliga förståelsen är ögonblicket "Jag kommer in", när sidan bara börjar byta. Du kan förbehandla sidans data vid denna punkt, och denna hook kommer att anropas varje gång.
1.3 ionViewDidEnter När denna hook triggas har användaren gått in på en ny sida (sidan är aktiv), och den anropas varje gång.
På tal om detta måste jag inflika, Ionics namngivning av krokar är väldigt vänlig för majoriteten av kinesiska studenter, och en kommer och en LÖSTE problemet. Till skillnad från vissa glamorösa (fel) ramverk utanför, finns det en massa redo, uppdatera, följt, destory, etc., kom ihåg en gång och glöm en gång. (Självklart är detta ett skämt, namngivningen av komponenter är nära relaterad till ramverkets funktionsmekanism.)
1.4 ionVyKommerLämnaT Page Ready (är på väg att göra det) aktiveras när användaren just har tryckt på tillbakaknappen eller relaterad händelse.
1,5 ionVyGjordeLämnaT Utlöst när sidan är klar är sidan inaktiv.
1,6 ionViewWillUnload Utlöser när en resurs på en sida är på väg att förstöras, skulle du gissa att denna krok, som ionViewDidLoad, bara kommer att utlösas en gång?
1.7 Testning Låt oss ta sidan vi skapade i föregående avsnitt och göra ett test på hur hooken är in. I föregående avsnitt implementerade vi processen att hoppa från HomePage till TestPage med hjälp av knappar, och nu lägger vi till de sex ovanstående krokarna till TestPage och observerar deras anrop via konsolen.
Kodkoden för sidtemats sektion är som följer
Observera att jag också lade till en testsats i konstruktören. Öppna Serve-felsökning, klicka på knappen, gå till TestPage och se vad konsolen ger utmatning.
Första gången på sidan
Gå tillbaka till startsidan och se vad konsolen ger ut.
Lämnar sidan för första gången
Gå in och avsluta TestPage igen och observera vad konsolen ger ut.
Andra in- och uttåget
Följande slutsatser kan dras:
- Konstruktorn avfyras före ionViewDidLoad
- ionViewDidLoad aktiveras bara när du först går in på sidan
- ionViewWillUnload triggas varje gång du lämnar sidan
2. Det finns också två guard hooks
Jag nämnde i början att jonic erbjuder 8 krokar, medan jag bara introducerade 6. De första 6 hooks har en gemensam egenskap, och deras returvärden är alla void, det vill säga de anropas vid motsvarande tillfälle och returnerar ingen information.
De andra två hookarna är lite annorlunda, de är ionViewCanEnter och ionViewCanLeave, som kan returnera booleska. Lyssna, jag pratade precis om tempus, och nu ska jag prata om modala verb. Om de första 6 krokarna är ett passivt svar från sidan på användarens besök, så har sidan nu medvetenheten att låta dig komma eller gå, ah, sidan har stått upp från och med nu!
Dessa två krokar spelar en större roll i auktoritetskontroll, och nyligen finns det ett mycket trendigt uttryck som kallas Vakt, hur man förstår denna vakt, du kan förstå den som samhällets grindvakt, den vänlige rektorn och den gamla trappan 2333 med tusentals poser i den urgamla aprikosblombyggnaden.
Nu när vi redan vet att den returnerar ett boolskt värde, låt oss prova. Eftersom det inte finns någon affärslogik i vårt program, låt oss använda ett tids-API för att bedöma här
Åtkomsten till sidan är blockerad
På samma sätt, om du vill lämna en sida kvar på en sida, om ionViewCanLeave returnerar false, blir du blockerad.
Återvändningsoperationen avlyssnas
Konsolens tryckta information
3 Sammanfattning
Ahem, inget mer nonsens, för att sammanfatta har Ionic följande livscykelkrokar
- ionViewDidLoad kallas första gången man returnerar void
- ionViewWillEnter returnerar void varje gång den anropas
- ionViewDidEnter returnerar void varje gång den anropas
- ionViewWillLeave returnerar void varje gång den anropas
- ionViewDidLeave returnerar void varje gång den anropas
- ionViewWillUnload returnerar void varje gång den anropas
- ionViewCanEnter returnerar booleskt varje gång den anropas
- ionViewCanLeave returnerar booleskt varje gång det anropas
|