How to bind a click event on “v-html” in Vue

Question

I have a simple example in jsfiddle, as described in the example, I want to insert the element via v-html and then bind the event in the insert element. In addition to adding id

Answer 1

You can add a ref on your div, and operate with its children elements like you do in regular JavaScript. For example, you can set an event listener for a link inside mounted hook:

var app = new Vue({
  el: '#app',
  data: {
    link: 'click me'
  },
  mounted() {
    this.$refs['mydiv'].firstChild.addEventListener('click', function(event) {
      event.preventDefault();
      console.log('clicked: ', event.target);
    })
  }
})