How to make Vue js directive working in an appended html element

Question

I have a Vue directive added in an appended html element like v-on directive but it\'s not working on my end. Basically I want to know the equivalent of .on() in jquery.

Answer 1

For Vue 2.x, the new solution is referenced here in the doc : https://vuejs.org/v2/api/#vm-mount (see 'Example').

Custom example :

var MyComponent = Vue.extend({
  template: '
Hello!
',
  methods : {
    world : function() {
      console.log('world')
    }
  }
})
 
var component = new MyComponent().$mount()
document.getElementById('app').appendChild(component.$el)

Works like a charm!