Javascript Vue.JS-收听单击组件

我是Vue.JS的新手，目前在监听组件上的单击事件时遇到了问题

JS:

Vue.component（'photo-option'{
数据：函数（）{
返回{
计数：0
}
},
道具：['src']，
模板：`
`
});

HTML:

…其中

foo

是我的主Vue实例上的一个方法

以上是基于，我看不出我做错了什么。警报不会触发，并且控制台中没有错误

在找到这些文档之前，我还尝试简单地将

v-on:click='…'

添加到JS（即模板）和HTML中，但都没有成功

我做错了什么

---

[编辑]

之所以会发生这种情况，是因为代码被lightbox脚本拾取，并且其DOM位置发生了更改。因此，可能绑定/事件附件正在丢失

---

Vue是否有任何方法可以实现这一点，可能是通过在元素上“重新初始化”自身或其他方式？

请包括一个。任何与DOM有关的库都应该使用Vue（和React等）来避免。您能否找到与vue兼容的其他库？

Vue.component('photo-option', {
    data: function () {
        return {
            count: 0
        }
    },
    props: ['src'],
    template: `
    <img :src=src v-on:click="$emit('my-event')" />
    `
});

<photo-option :src=uri v-for='uri in aboutUsPhotos' v-on:my-event="foo" />