I am attempting to trigger the event in a JavaScript string.
Within the buffer
, I have called this event:
@click.prevent = "Buy($event)"
However, the browser is not interpreting it correctly:
https://i.sstatic.net/uHs8W.jpg
Here is the code snippet:
JavaScript:
var buffer="";
for(let i=0 ;i < Object.keys(result).length;i++) {
buffer += "<div class='category-item'><a class='button-product-info-s' href='/product/"+result[i]['id']+"'/><img class='product-img-s' src='"+result[i]['pic_url'] +"'></a><p class='product-name-s'>"+result[i]['name']+"</p><a @click.prevent='Buy(event)' href='' class='btns btn-primarys btn-buy-s' value='"+result[i]['id']+"'>Buy</a></div>";
}
this.codes= buffer;
//Buy function
Buy:function (event) {
element= event.currentTarget;
value = element.getAttribute('value');
}
HTML:
<div v-html="codes"></div>
The issue is that the browser does not recognize that the event is triggered on the <a>
tag and not an attribute
result
represents my API data.