Как я могу получить доступ к методу дочернего компонента?

Question

Как я могу получить доступ к методу дочернего компонента?

1

У меня есть дочерний компонент, который встроен в родительский. Я хочу получить доступ к дочернему методу от родителя. Я хочу использовать $refs для этой цели.

Шаблон:

<template>
  <div>Parent!</div>
</template>

Автор сценария:

<script>
    Vue.component('child',{
      template: '<div>I am child</div>',
    }
    export default {
       name: 'Parent'
    }
</script>

Как я могу объявить $refs для моего ребенка в этом случае?

Anna F 12 янв. 2019, в 14:15

Источник

0

Вы могли бы показать дочерний метод и как вы хотите использовать его в родительском компоненте?
Boussadjra Brahim 12 янв. 2019, в 13:26

Теги:

javascript

vue.js

1 ответ

Ещё вопросы

Вы могли бы показать дочерний метод и как вы хотите использовать его в родительском компоненте?

Ana Liza Pandac · Answer 1 · 2019-01-12T10-38-00.000Z

Для этого вы можете присвоить ссылочный идентификатор дочернему компоненту, используя атрибут ref.

<template>
  <div>Parent!</div>
  <child ref="childComponent"/>
</template>

Теперь вы можете получить доступ к экземпляру дочернего компонента из родительского компонента, используя его следующим образом:

this.$refs.childComponent // where componentName is the ref value

Это также означает, что вы можете выполнять методы, которые вы определили в своем дочернем компоненте.

this.$refs.childComponent.myFunction();

Смотрите документы для более подробной информации.

Кроме того, классическая проблема, с которой нужно столкнуться, когда новичок в Vue, заключается в том, что ссылки доступны только в смонтированном хуке и после. (В противном случае они не определены). Кроме того, если ссылка находится внутри v-if, вам может потребоваться дождаться ее в обновленном хуке.
Да, это я узнал, когда пытался получить доступ к свойству дочернего экземпляра в хуке created() и это приводит к этой ошибке.