如何点击整个 vuejs 组件 [英] How to click on whole vuejs component

问题描述

我有组件

我想点击后运行方法

<my-component @click="showOtherDiv"></my-component>

我在主要应用方法上有这个方法

i have this method on main app methods

var app = new Vue({
    el: '#app',

    data: {},

    methods: {
        showOtherDiv : function(){
            alert('Some message');
        }
    }
});

但似乎点击"不适用于完整组件

but seems like "click" not works on full component

推荐答案

1. 注册你的组件，并在里面声明处理程序方法:

1. Register your component, and declare the handler method inside:

Vue.component('my-component', {
    // ...
    methods: {
        showOtherDiv : function(){
            alert('Some message');
        }
    }
});

将 .native 修饰符添加到事件名称:

Add the .native modifier to the event name:

<my-component @click.native="showOtherDiv"></my-component>

来自文档:

将原生事件绑定到组件

[…] 当你想监听组件根元素上的原生事件 […] 你可以使用 .native 修饰符<代码>v-on.

[…] when you want to listen for a native event on the root element of a component […] you can use the .native modifier for v-on.

这篇关于如何点击整个 vuejs 组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！