Комментарии 14
Я правильно понял, что данные с api запрашивать выгоднее всего на created()
, а не mounted()
?
Ради интереса попробовал в рабочем проекте активировать загрузку в created() (было в mounted).
Результат ожидаемый. Разницы не заметил никакой.
Все равно загрузка через axios и результат приходит всяко после того как все "отрисовано".
Так все же, а в чем суть и причина этой рекомендации?
Ради интереса посмотрел dt между created и mounted для одной и той же страницы в разных браузерах (последние версии на Windows) на одном компе:
- Chrome — среднее 180ms. деривация 5ms
- IE 11 — среднее 400ms. деривация 15ms
- Opera — 152ms. деривация 4ms
- FF — 300ms. деривация 10ms
Это на относительно дохленьком компе для средне насыщенной страницы (таблица + диаграммы и пр… по мелочи).
Субъективно разница в 0.5 сек не улавливается. Поэтому и запихивал загрузку ресурсов в уже вызываемый (для тонкой настройки) блок mounted.
подробнее medium.com/@brockreece/vue-parent-and-child-lifecycle-hooks-5d6236bd561f
А вообще не очень понятно, зачем вам так часто что то в mounted приходится тонко настраивать. У меня в среднего размера проекте этот хук используется в двух местах, где пришлось поковырять dom через ref — это внешние зависимости плохо совместимые с vue. И они спрятаны в переиспользуемых компонентах.
Часто, это я сгоряча… фактически настройки то же только в паре месте пришлось делать.
Для для диаграмм и графиков (сhart.js).
Возможно не правильный способ. Но я с ходу самый простой что бы понять размер и подкорректировать размеры canvas под фактический размер ($el.getBoundingClientRect())
Правильный не правильный… но некогда было искать другие решения. работает и ладно.
То, что mounted родителя вызовется после ребенка, — это скорее всего. но не факт
Вот меня тот же вопрос мучает!
Почему люди не пытаются принести какую-то свою "добавочную стоимость"? Встречал даже курсы, включая платные, которые тупо читают документацию в вольном стиле.
Ещё видел курсы по книге.
Также интересно, что смотрел штук под 10 книг по Angular 2+ и не одна не даёт ничего больше, чем документация.
Хуки жизненного цикла Vue.js