Как передать $ref из дочернего компонента в родительский?

Question

[reasonov]

Здравствуйте, не могу нигде найти ответ на свой вопрос. Есть компонент, в нем элементу задан ref, мне нужно из родителя обратиться к этому ref'y, как это можно сделать? Заранее спасибо

Answer 1

[Aetae]

Правильный ответ: не надо этого делать. Каждый компонент - чёрный ящик. Ты не знаешь что там внутри и какие там рефы наблюдая из родителя. В этом суть компонентного подхода - в любой момент можно без проблем кардинально менять содержимое компонента, не меня его свойства.

Плохой ответ: самым очевидным образом: получить ref на ребёнка и в свою очередь забрать ref у него: this.$refs.child.$refs.childOfChild.
Возможно придётся также дождаться загрузки ребёнка, если он лежит в scoped слоте.

Comments

[reasonov]

Спасибо, я посмотрю, как можно обойтись без этого, но пока на первое время нужно оставить так. Я вроде сделал, как вы написали, но выдало такую ошибку "TypeError: Cannot read property '$refs' of undefined". Можно чуть поподробнее описать, как это должно выглядеть?

[Aetae]

reasonov, обращаться к $refs можно только после mounted, когда компонент ещё не примонтирован - никаких элементов ещё нет, чтоб на них ref получить. Если компонент находится в scoped слоте или появляется по условию - тогда и на mounted стадии его может не быть.
Нужна конкретная структура чтоб сказать подробнее, в минимально примере всё работает:

Answer 2

[Roman K]

Не нашёл, потому что так не стоит делать. Вниз передаются пропсы, вверх - ивенты. $ref используется крайне редко и это вообще костыль. Прямого доступа к DOM скорее всего не нужно (но зависит от кейса)