CODEWITHSUNDEEP
vue.jsvuejs2
Vincent Decaux
Vincent Decaux

Reputation: 10714

VueJS 2 $emit and $on

I use VueJS 2 and I really don't figure out how communicate from child component to parent.

I have 2 components : Dashboad and DashboardPanel.

In DashboardPanel, I have one method :

execute () {
    // emit to parent
    this.$emit('executeSQL', this.value)
    ...
}

And in Dashboard :

mounted () {
   // get event from DashboardPanel
   this.$on('executeSQL', function(value) {
        alert(value)
   })
}

Nothing happens, I don't find in doc where to use $on and I don't know if I can use other way to achieve it ?

Upvotes: 1

Views: 1697

Answers (1)

Nicolas P.
Nicolas P.

Reputation: 601

You have to specify in Dashboard component how to react to executeSQL event from DashboardPanel component. In the HTML template of Dashboard:

<DashboardPanel v-on:executeSQL="doExecuteSQL($event)" />

doExecuteSQL beeing a method of Dashboard:

methods: {
  doExecuteSQL(value) { ... }
}

Hope this will help.

Upvotes: 5

Related Questions