Add Custom Event on dynamic Component Vue.js

Viewed 142

I've created a dynamic Custom Component and i wanna register/add a custom event on this component,like:

<SelectContactRowComponent @customevent="custommethod()"></SelectContactRowComponent

This is my dynamic customcomponent code:

  var RowComponent = Vue.extend(SelectContactRowComponent);

  var instance = new RowComponent( {propsData: {
      item_data: {'lastname': '', 'firstname' : '', 'email' : '', 'telephone' : ''},
      isDOMadd : true,
      data_source_url : this.data_source_url,
      id: this.id,
      id_name: this.id_name,
      morph_class_id: this.morph_class,
    }
    
  }).$mount();
1 Answers

You should do that in your emit option of the SelectContactRowComponent

 const app = Vue.createApp({})
    app.component('select-contact-row-component', {
      emits: ['customevent']
    })

Then you can emit it within the SelectContactRowComponent methods, or lifecycle hooks depending on your logic

this.$emit('customevent', { payload })
Related