1. Что такое жизненный цикл?
Процесс экземпляра vue от создания до уничтожения — это жизненный цикл.Жизненный цикл vue в основном делится на четыре этапа и восемь функций-ловушек.
2. Каковы четыре основных этапа и восемь функций крючка?
1. До и после создания
beforeCreate: когда функция ловушки beforeCreate выполняется, данные и метод не были инициализированы, только некоторые методы по умолчанию vue
created: когда созданная функция ловушки выполняется, данные и метод были инициализированы и могут работать
2. До и после рендеринга
beforeMount: при выполнении функции ловушки beforeMount шаблон отрисовывался в памяти, но не отображался на странице.
Mounted: Когда смонтированная функция ловушки выполняется, она заменяет визуализированный шаблон в памяти браузером, чтобы завершить реальную визуализацию страницы.
3. До и после монтажа
beforeUpdate: при выполнении функции ловушки beforeUpdate данные в data были обновлены, но страница еще не обновлена.
обновлено: когда выполняется обновленная функция ловушки, обновленные данные в данных синхронно обновляются в представлении.
4. До и после разрушения
beforeDestroy: при выполнении хука-функции beforeDestroy экземпляр переходит в стадию подготовки к уничтожению, а данные, методы, инструкции и т. д. все еще доступны
уничтожено: когда функция хука уничтожена, экземпляр уничтожается, а ата, метод, инструкции и т. д. недоступны.
Два наиболее часто используемых хука жизненного цикла создаются (отправка ajax-запроса, инициализация данных) и монтируются (рендеринг данных).
Пополнить:
Но при использовании встроенного компонента Vue keep-alive будет еще 3 хука жизненного цикла.
активировано: вызывается при активации компонента поддержки активности
деактивировано: вызывается, когда компонент поддержки активности деактивирован
errorCapured: вызывается при перехвате ошибки от компонента-потомка, эта функция ловушки получает 3 параметра: объект ошибки, экземпляр компонента, в котором произошла ошибка, и строку, содержащую информацию об источнике ошибки; для предотвращения ошибки может быть возвращено значение false. от продолжающегося распространения вверх
3. Крючки жизненного цикла родительско-дочерних компонентов
1. Загрузите процесс рендеринга
отец перед созданием --> отец создал --> отец перед монтированием --> дочерний элемент перед созданием --> созданный дочерний элемент -->
дочерний элемент beforeMount --> смонтированный дочерний элемент --> смонтированный отцом
2. Процесс обновления подкомпонента
отец перед обновлением --> дочерний элемент перед обновлением --> обновленный дочерний элемент --> обновленный отец
3. Процесс обновления родительского компонента
отец до обновления --> отец обновлен
4. Процесс разрушения
отец перед уничтожением --> дочерний элемент перед уничтожением --> уничтоженный дочерний элемент --> уничтоженный отец