[Vuejs]-Vuejs click event displays correct item of array when clicked

0👍

Inside your event handler you are using this.choc which would be undefined because it does not exist in the vue model. You need to pass the choc object to your event handler:

<div class="carousel-cell-card" v-on:click="handleTileClick(choc)"></div>

and then use it there

handleTileClick: function(choc) {
  $("#fox").append(`<div id="popover-dialog">data here: ${choc.description}</div>`);
}

0👍

you need to send the specific item that was clicked as an argument of your function
like this :

v-on:click="handleTileClick(choc)"

then in your function

handleTileClick: function(choc){
    $("#fox").append(`<div id="popover-dialog">data here: ${choc.description} 
    </div>`);
  }

Leave a comment