3

Among the approaches below, which do you think is better practice ??

[ 1 ] Using $emit to expose methods from child component to parent component

$emit('updateAPI',  exposeAPI({ childMethod: this.childMethod }))

OR

[ 2 ] Using $refs from parent component to access child component methods

this.$refs.childComponent.childMethod()
Don Nisnoni
  • 104
  • 9
  • You should read the answer over here.Everything is explained really well for understanding. https://stackoverflow.com/questions/40957008/how-to-access-to-a-child-method-from-the-parent-in-vue-js/40957171 – Riddhi Apr 12 '19 at 08:38
  • Emit - definitely. It completely decouples the parent and child element to increase reusability. – user37309 Apr 12 '19 at 11:59

1 Answers1

1

About $refs, according to the docs:

"$refs are only populated after the component has been rendered, and they are not reactive. It is only meant as an escape hatch for direct child manipulation - you should avoid accessing $refs from within templates or computed properties."

About callbacks, I have no information about cons and there is a nice example in script section of this component of Quasar Framework, which parent component recieves via emit a function called reset and can dispatch this child function. That's why I think this way is preferable.

tony19
  • 125,647
  • 18
  • 229
  • 307
Matheus Valenza
  • 889
  • 1
  • 5
  • 11