标签: vue.js-directives

如何捕获Vue.js上自定义指令的click事件?

我正在尝试学习Vue.js,并来到一个练习示例,在该示例中,我需要实现一个自定义指令,使虱子“ v-on”工作。这意味着我需要捕获自定义指令上的click事件并调用一个方法。

我在想的模板。

<template>
    <h1 v-my-on:click="alertMe">Click</h1>
</template>
Run Code Online (Sandbox Code Playgroud)

问题是我不知道如何在自定义指令中捕获click事件。请原谅下面的笨拙代码。

<script>
    export default {
        methods: {
            alertMe() {
                alert('The Alert!');
            }
        },
        directives: {
            'my-on': {
                bind(el, binding, vnode) {
                    console.log('bind');

                    el.addEventListener('click',()=>{
                        console.log('bind');
                        vnode.context.$emit('click');
                    });
                },

            }
        }
    }
</script>
Run Code Online (Sandbox Code Playgroud)

谁能帮助我了解其运作方式?我没有找到类似例子的任何例子。

vue.js vuejs2 vue.js-directives

3
推荐指数
1
解决办法
4306
查看次数

标签 统计

vue.js ×1

vue.js-directives ×1

vuejs2 ×1