Vue.js - невозможно добавить событие click

Я пытаюсь добавить прослушиватель событий событий для DOM. Все скрипты в комплекте с webpack, который компилирует его в один большой файл.

Это мой компонент:

<template>
    <div class="formchat-window">
        <a>test</a>
        <div class="title" v-on:click.self="toggle">Nevite si rady? Zeptejte se!</div>
        <wp-formchat-screen v-if="windowActive"></wp-formchat-screen>
    </div>
</template>

<script>
    export default {
        mounted () {
            console.log('mounted');

        },

        methods: {
            toggle(event) {
                alert('click on toggle');
                this.windowActive = !this.windowActive;
            }
        },

        data() {
            return {
                windowActive: false,
            };
        }
    }
</script>

<style lang="scss">
    $color: red;

    .formchat-window {
        position: fixed;
        right: 10%;
        bottom: 0;
        width: 300px;
        z-index: 9999;
        .title {
            background: $color;
        }
    }
</style>

Это мой основной файл JS:

import Vue from 'vue'
import FormChat from './FormChat'

import FormchatAnswer from './components/FormchatAnswer'
import FormchatEntry from './components/FormchatEntry'
import FormchatScreen from './components/FormchatScreen'
import FormchatWindow from './components/FormchatWindow'


window.Vue = Vue;


console.log('test');

Vue.component('WpFormchatAnswer', FormchatAnswer);
Vue.component('WpFormchatEntry', FormchatEntry);
Vue.component('WpFormchatScreen', FormchatScreen);
Vue.component('WpFormchatWindow', FormchatWindow);

const app = new Vue({
    el: '#wp-formchat-vue-root',
    //render: h => h(FormChat)
});

Однако я сделал все, и компилятор отлично работает, я не могу зарегистрировать клик, поэтому метод не будет запускаться.

Кто-нибудь может мне помочь, пожалуйста!

onclick,vuejs2,vue-component,

0