如何使用 ref<component> 在 vuejs 中？

Question

I am having two independent VUE components and I want to communicate between them.

In the first component, I am using <component> and added ref to it.

<component ref="dynamicComponent"></component>

and in that above dynamic component, there is a method(suppose dynamicMethod ) and I want to call that method from second component.

So for that, I am using below code:

this.$root.$refs.dynamicComponent.dynamicMethod();

But I am getting this.$root.$refs a blank object. How can I call that method.

Any help would be appreciated.

Answer 1

Make sure you're trying to access $refs only after the component is mounted. You should be able to access the $refs in the mounted hook.

mounted: function() {
  console.log(this.$refs);
},