Vue.js fire event in component

To fire an event in a component and respond to it in the parent.

In the component, inside “methods” create a method with this.$emit

e.g.

<br />
methods: {<br />
    my_event(somedata) {<br />
        this.$emit('my_event', somedata);<br />
    }<br />
}<br />

Trigger this somehow

e.g.

<br />
&lt;a href=&quot;javascript:;&quot; v-on:click=&quot;my_event(some-data)&quot;&gt;Some action&lt;/a&gt;<br />

Then in the parent create a method to respond to this

<br />
methods: {<br />
    OnMyEvent() {<br />
        //do something<br />
    }<br />
}<br />

And then wire the event up on the component markup

<br />
&lt;my-component v-on:my_event=&quot;OnMyEvent&quot;&gt;&lt;/my-component&gt;<br />

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.