1

I am using two child template under a parent template. The first child template calls an API while being created. With this API response, some operations will be done in the second child template. So I need to emit API response to parent template then pass it to the next child template. How can I emit the API response from first child template?

naimul64
  • 133
  • 3
  • 17
  • you may want to use vuex and you won't need to emit events when data is changed you need to commit your changes in the store and any component uses this data will rerender – Talal Jun 07 '21 at 06:58
  • Use `this.$parent.xxx = xxx` – jizhihaoSAMA Jun 07 '21 at 07:37
  • Does this answer your question? [Communication between sibling components in Vue.js 2.0](https://stackoverflow.com/questions/38616167/communication-between-sibling-components-in-vue-js-2-0) – Chin. Udara Jun 07 '21 at 07:41

1 Answers1

1

Emit data/params like this from child component

this.$emit("function-child", param1, param2);

Catch data/params and call function in parent component like this

<childComponent @function-child="functionParent"></childComponent>

function use in parent

functionParent(param1,param2){//do what you want to}
Excalibaard
  • 1,903
  • 9
  • 19
Shamsail
  • 612
  • 6
  • 17
  • 2
    Unlike components and props, event names don’t provide any automatic case transformation. Instead, the name of an emitted event must exactly match the name used to listen to that event ```always use kebab-case for event names``` https://vuejs.org/v2/guide/components-custom-events.html#Event-Names – Talal Jun 07 '21 at 07:02