Dropdown work only one time

Hi all, 
I have following problem, my dropdown is working only one time then the toggle variable doesn't change. It seems that the function  handleToggle fired only once and then get ignored but the away function from vue-clickaway is fired everytime i click also on the dropdown itself.
I copied all exactly from the downloaded source. The only thing I have done is removed the local registration and made it global.
I am using Laraval + Vue
Dropdown.vue (without scoped style):

<template>
  <component :is="tag" :class="className" :style="style">
    <span @click="handleToggle" v-on-clickaway="away">
      <slot name="toggle"></slot>
    </span>
    <transition @enter="enter" @after-enter="afterEnter" @before-leave="beforeLeave">
      <div v-if="toggle" :class="collapseClass">
        <slot></slot>
      </div>
    </transition>
  </component>
</template>

<script>
    import { mixin as clickaway } from 'vue-clickaway';

    export default {
        props: {
            tag: {
                type: String,
                default: "div"
            },
            show: {
                type: Boolean
            },
            btnGroup: {
                type: Boolean
            },
            dropup: {
                type: Boolean,
                default: false
            },
            dropright: {
                type: Boolean,
                default: false
            },
            dropleft: {
                type: Boolean,
                default: false
            },
            split: {
                type: Boolean,
                default: false
            },
            megaMenu: {
                type: Boolean
            }
        },
        data() {
            return {
                toggle: false
            };
        },
        mixins: [clickaway],
        methods: {
            away() {
                this.toggle = false;
                console.log("away");
            },
            enter(el) {
                el.style.opacity = 0;
            },
            afterEnter(el) {
                el.style.opacity = 1;
            },
            beforeLeave(el) {
                el.style.opacity = 0;
            },
            handleToggle(e) {
                console.log("click on toggle");
                this.toggle=true;
                e.preventDefault();
            }
        },
        computed: {
            className() {
                return classNames(
                    this.btnGroup ? 'btn-group' : 'dropdown',
                    this.show && 'show',
                    this.dropup && 'dropup',
                    this.dropright && 'dropright',
                    this.dropleft && 'dropleft',
                    this.megaMenu && 'mega-dropdown'
                );
            },
            style() {
                return {
                    'margin-left' : this.split && '-0.3rem'
                };
            },
            collapseClass() {
                return classNames(
                    this.megaMenu ? 'mega-menu-collapse-item' : 'collapse-item'
                );
            }
        }
    };
</script>

Thanks for helping