[Vuejs]-Vue2 Component not rendering when data is updated

0👍

Problem is you have 2 Vue instances in your example:

var vm = new Vue({
    el: '#app',
    data: {
        json: mydata
    },
    methods: {
      open: function(e){
        
        imageframe = e.target.src;
        eventHub.$emit('clickedImage', imageframe)
    }
  }
});

new Vue({ el: '#frame' }) // remove this to make it work

Remove new Vue({ el: '#frame' }) to make it work…

Also do not use this in the template.

Change

<div><h3>Hello {{name}} {{src}}</h3><img v-bind:src="this.src" /></div>

to

<div><h3>Hello {{name}} {{src}}</h3><img v-bind:src="src" /></div>

Leave a comment