Essayez d'utiliser v sur:flou pour faire disparaître un menu contextuel...mais ça ne fonctionne pas

Je suis le codage d'un simple menu contextuel dans vue.js. Quand je fais un clic droit sur un élément particulier, il ouvre le menu (à l'aide de @contextmenu.prévenir).Les travaux de cette.

Mais quand je clique en dehors du menu, je veux qu'il disparaisse. Cela ne fonctionne pas... je suis à l'aide de v sur:flou pour cette, également essayé @flou . Aucun d'entre eux ne fonctionne pas. Voici mon code html :

<!-- my context menu -->
<ul class="context-menu"
    ref="contextMenuTrack"
    v-if="openedMenu === 'contextMenuTrack'"
    v-bind:style="{top: top, left: left}"
    v-on:blur="closeMenu()">
    <li v-on:click="removeTrack(project.structure.tracks.indexOf(targetOfMenu));closeMenu()">delete track</li>
</ul>
<div>

    [ ...... stuff here ......]

    <!-- Where the menu is called-->
    <li class="track"
         v-for="track in project.structure.tracks">
        <div class="track-name-row">
            <li @contextmenu.prevent="openContextMenuTrack(track,$event)"
                v-on:click="expandTrack(project.structure.tracks.indexOf(track))"
                class="track-color-viewer"></li>

                [ .... other li tags .....]
        </div>
    </li>

    [ ...... stuff here ......]

</div>

Voici les données utilisées pour le menu de ma Vue composant:

data() {
    return {
        //the kind of menu which is opened
        openedMenu: undefined,
        //the coordinate of the menu
        top: "0px",
        left: "0px",
        //the element which is targeted by the menu
        targetOfMenu: undefined
    };
},

Et ici sont les méthodes utilisées pour le menu dans mon Vue.js composant :

 methods: {

    setMenu(top, left) {
        this.top = top - 170 + "px";
        this.left = left + "px";
    },

    //opening menu : calling set menu whith x and y
    openContextMenuTrack(track, event) {
        this.openedMenu = "contextMenuTrack";
        this.targetOfMenu = track;

        this.$nextTick((() => {
            this.$refs.contextMenuTrack.focus();
            this.setMenu(event.y, event.x);
        }).bind(this));
    },

    closeMenu() {
        this.openedMenu = undefined;
        this.targetOfMenu = undefined;
    }
}