ElementUI菜单导航NavMenu鼠标滑动展示菜单

NavMenu导航菜单在vertical情况下没办法实现鼠标移入元素展示菜单，移出元素关闭菜单功能，故而需要额外写代码实现。
html代码实现：

    <el-menu
      default-active="1"
      class="el-menu-vertical-demo"
      mode="vertical"
      id="el-menu-demo" 
      ref="menu">
      <el-submenu index="1">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>导航一</span>
        </template>
        <el-menu-item-group>
          <template slot="title">分组一</template>
          <el-menu-item index="1-1">选项1</el-menu-item>
          <el-menu-item index="1-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="1-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="1-4">
          <template slot="title">选项4</template>
          <el-menu-item index="1-4-1">选项1</el-menu-item>
        </el-submenu>
      </el-submenu>
    </el-menu>

利用鼠标移入与移出事件来实现功能
js代码如下：

mouseLeave(){   //实现工具栏鼠标滑过的展示与关闭
     var Vuethis=this;
     var elMenu=document.getElementById("el-menu-demo");
     elMenu.onmouseleave=()=>{
         Vuethis.$refs.menu.close("1");
     };
     elMenu.onmouseover=()=>{
         Vuethis.$refs.menu.open("1");
     };
 }