З мого досвіду, більшість студентів знають це поняття. Якщо ви мало що знаєте, то слід знати, що браузер запускає подію завантаження при завантаженні веб-сторінки, і ми зазвичай використовуємо метод $(document).load() у window.onload або jquery, щоб визначити, що має робити веб-сторінка під час завантаження.
У APP такі заходи багатші. Часто потрібно щось зробити для користувачів до того, як вони побачать сторінку, найпоширенішим є витягування даних із сервера; Або зробити щось, коли вони збираються залишити сторінку.
1. Зрозумійте гачок іонного життєвого циклу
Станом на Ionic 3.8.0 фреймворк надає 8 функцій гачків, які запускаються на різних етапах життєвого циклу сторінки.
1.1 ionViewDidLoad
Тригер завершення завантаження сторінки, тут «завантаження завершено», означає стан сторінки, коли необхідні ресурси були завантажені, але ще не ввели стан сторінки (користувач все ще бачить попередню сторінку).
Слід зазначити, що це дуже зарозумілий гачок, який викликають лише один раз у всьому процесі, тобто його викликають, коли ви вперше заходите на сторінку, і після цього, незалежно від того, як ви заходите чи виходите, вона буде порожньою і жалюгідною. Якщо тільки ви не вимкнете фон і не зайдете назад у програмне забезпечення (також можна натиснути оновлення під час налагодження веб-сторінки).
Отже, цей гачок підходить для одноразової обробки, наприклад, для отримання даних користувача з сервера та їх зберігання в кеші.
1.2 ionViewWillEnter
Буквальне розуміння — це момент «Я заходжу», коли сторінка просто починає змінюватися. Ви можете попередньо обробити дані сторінки на цьому етапі, і цей гачок буде викликатися щоразу.
1.3 ionViewDidEnter
Коли цей гачок спрацьовує, користувач вводить нову сторінку (сторінка активна), і вона буде викликатися щоразу.
Говорячи про це, мушу втрутитися: назва гачків у ionic дуже привітна до більшості китайських студентів, і один із них ДІЙСНО вирішує цю проблему. На відміну від деяких гламурних (неправильних) фреймворків поза межами, тут є багато готових, оновлених, виконаних, десюжетних тощо, пам'ятати один раз і забути раз. (Звісно, це жарт, адже назва компонентів тісно пов'язана з механізмом роботи фреймворку)
1.4 ionViewWillLeave
Page Ready (ось-ось почне) активується, коли користувач щойно активував кнопку «назад» або пов'язану подію.
1.5 ionViewDidLeft
Спрацьовує, коли сторінка завершена, вона стає неактивною.
1.6 ionViewWillUnload
Тригери, коли ресурс на сторінці ось-ось буде знищений — чи могли б ви припустити, що цей хук, як ionViewDidLoad, спрацює лише один раз?
1.7 Тестування
Візьмемо сторінку, яку ми створили в попередньому розділі, і проведемо тест завантаження гачка.
У попередньому розділі ми реалізували процес переходу з HomePage на TestPage за допомогою кнопок, а тепер додаємо вищезазначені шість гачків до TestPage і спостерігаємо за їх викликом через консоль.
Код розділу теми сторінки виглядає так:
Зверніть увагу, що я також додав тестовий оператор до конструктора. Відкрийте налагодження Serving, натисніть кнопку, перейдіть на TestPage і подивіться, що показує консоль.
Вперше на сторінці
Поверніться на головну сторінку і подивіться, що показує консоль.
Вперше залишаю сторінку
Знову заходьте і виходьте з TestPage і спостерігайте, що показує консоль.
Другий в'їзд і виїзд
Можна зробити такі висновки:
- Конструктор запускається до ionViewDidLoad
- ionViewDidLoad спрацьовує лише при першому вході на сторінку
- ionViewWillUnload запускається після кожного виходу зі сторінки
2. Також є два захисні гачки
Я згадував на початку, що ionic пропонує 8 гачків, а ввів лише 6. Перші 6 гачків мають спільну рису, і всі їхні повернені значення є недійсними, тобто вони викликаються у відповідний момент і не повертають жодної інформації.
Інші два гачки трохи відрізняються — це ionViewCanEnter і ionViewCanLeave, які можуть повертати булеві показники.
Дивіться, я щойно говорив про часи, а тепер поговорю про модальні дієслова. Якщо перші 6 гачків — це пасивна реакція сторінки на відвідування користувача, то тепер сторінка має свідомість, щоб дозволити вам прийти або піти, ах, сторінка вже стоїть на місці!
Ці два гачки відіграють більшу роль у контролі влади, і нещодавно з'явився дуже модний термін «Охорона», як зрозуміти цього охоронця, його можна розуміти як вартового спільноти, доброзичливого директора та старого дрохви 2333 з тисячами поз у будівлі стародавнього абрикосового цвіту.
Тепер, коли ми вже знаємо, що він повертає булеве значення, давайте спробуємо. Оскільки в нашій програмі немає бізнес-логіки, давайте використаємо API часу для оцінки
Доступ до сторінки заблоковано
Аналогічно, якщо ви хочете залишити сторінку, якщо ionViewCanLeave поверне false — вас заблокують.
Операція повернення перехоплюється
Інформація з надрукованої консолі
3 Резюме
Кхм, без дурниць, підсумовуючи, у Ionic є такі гачки життєвого циклу
- ionViewDidLoad викликається вперше, коли повертає void
- ionViewWillEnter повертає void щоразу, коли його викликають
- ionViewDidEnter повертає void щоразу, коли його викликають.
- ionViewWillLeave повертає void щоразу, коли його викликають
- ionViewDidLeave повертає void щоразу, коли його викликають
- ionViewWillUnload повертає void щоразу, коли його викликають.
- ionViewCanEnter щоразу повертає булевий показник при виклику
- ionViewCanLeave щоразу повертає булевий ефект при викликанні
|
Опубліковано 21.06.2018 10:30:06
|
|
|
|
