Vue 下拉菜单

在做一个下拉菜单，如图所示，需要在鼠标移动（非点击）到上图1区域时显示下拉菜单，鼠标移出下图2区域的时候隐藏下拉菜单。

<div class="tab-module" @mouseenter="showDropmenu()" @mouseleave="hideDropmenu()">
    <span>手动组卷</span>
    <div class="tab-dropdown" v-show='dropmenuActive'>
        <div class="link" @click="shiftPage(20)">按章节</div>
        <div class="link" @click="shiftPage(21)">按知识点</div>
    </div>
</div>

dropmenuActive是一个bool值用来控制下拉菜单的显示/隐藏。