Оригинальный адрес:Listen to lifecycle hooks on third-party Vue.js components
Оригинальный автор:Alex Jover
Переводчик:Дядя Программист Он
Специальная оговорка: эта статья является авторомAlex JoverОпубликовано вVueDoseряд выше.
Авторские права принадлежат автору.
Переводчик связался с автором перед переводом и получил разрешение на перевод всей серии.
Чтобы не мешать всеобщему прочтению, разрешенные записи будут размещены в конце этой статьи.
текст
Технику, о которой я собираюсь рассказать сегодня, я научился у своего друга.Damian Duliszвыучился там. Он является членом основной команды Vue.js, официального новостного сайта.Vue newsletterзастройщик и все жеvue-multiselectАвтор библиотеки.
В некоторых сценариях мне нужно знать о родительском компоненте, когда создается, монтируется или обновляется дочерний компонент, особенно при создании компонентов для собственных библиотек js.
Вы, наверное, знаете, что есть несколько способов реализовать вышеуказанные требования на ваших собственных компонентах. Например, инициировав событие в обработчике жизненного цикла дочернего компонента, например так:
mounted() {
this.$emit("mounted");
}
Затем вы можете сделать это на родительском компоненте:<Child @mounted="doSomething"/>.
Я вам говорю, что так делать не надо, более того, вы действительно можете так поступать при работе со сторонними компонентами.
Вместо этого, используя@hook:Префикс прослушивает перехватчики в жизненном цикле и указывает функцию обратного вызова.
Например, если вы хотите использовать сторонний компонентv-runtime-templateсделать что-то при рендеринге, тогда вы можете прослушать его жизненный циклupdatedкрюк:
<v-runtime-template @hook:updated="doSomething" :template="template" />
Не верите мне? Убедитесь в этом сами на CodeSandboxпримерБар!
Вы можете прочитать это онлайноригинальный, исходный код которого доступен для копирования и вставки. Если вам понравилась эта серия, поделитесь ею с коллегами!
Эпилог
Другие статьи из этой серии будут синхронизированы с выпуском официального сайта серии и будут своевременно переведены и опубликованы в Nuggets. Пожалуйста, продолжайте следить"Программа Обезьяны, дядя Хе", я верю, что принесу вам больше качественного контента, не забудьте поставить лайк~
Если вы хотите узнать больше о переводчике, проверьте следующее:
- личный блог:blog.hadesz.com
- Персональный репозиторий на гитхабе:github.com/hadeshe93
- Личный публичный аккаунт WeChat: поиск «Дядя Он, программист»
Запросить запись авторизации перевода
Если вы считаете, что эта статья хороша, поделитесь ею с друзьями~