Dashboad 2 template node mouse click

Dashboard
1

Using dashboard 2 template node to show base64 encoded image:

<template>
    <img :src="`data:image/jpg;base64,${msg.payload}`" class="image1" />
</template>

How can fetch a mouse click on the image?
Whenever a mouse click happens on the image, a message shall be sent from the node.
I tried some other solutions but they did not work so far.

Or if some icons can be placed on the image that can be clicked on would also be a way

2

We have examples in the documentation: Template ui-template | Node-RED Dashboard 2.0

So, to extend what you have already:

<template>
    <img :src="`data:image/jpg;base64,${msg.payload}`" class="image1" @click="onClick"/>
</template>
<script>
export default {
   methods: {
      onClick: function () {
          const msg = {
             payload: 'Hello World'
          }
          this.send(msg)
      }
   }
}
</script>
3

I was looking at these samples but had some issues with it. Your solutions works just fine. Thanks