如何将孙子菜单对象的属性传递给祖父母？

我的雇主决定用另一个子页面扩展菜单栏，以前完全正常的东西（简单的一个子菜单）现在不想工作了，因为它有子菜单，在另一个子菜单下。这是图片：

正如您所看到的，当我将鼠标悬停在“Acts”上时，带有外部和内部文档的子菜单运行良好

但是当我想将光标移动到带有“导演命令”的另一个子菜单上时，整个菜单都隐藏了。我认为这是因为第二个子菜单（孙子）不会将信息传递给主菜单元素（祖父）以保持菜单处于活动状态，但我不知道如何修复它。这是代码：

<v-menu open-on-hover bottom offset-x transition="slide-x-transition">
      <template v-slot:activator="{ on }">
      <v-list-item link v-on="on">
        <v-list-item-content>
          <v-list-item-title class="subtitle-1">Acts <v-icon class="menu-icon">keyboard_arrow_right</v-icon></v-list-item-title>
        </v-list-item-content>
      </v-list-item>
      </template>
          <v-list color="#F0FAFE">
            <router-link to="/External"><v-list-item link>
              <v-list-item-content>
                <v-list-item-title class="subtitle-1 font-weight-medium">External</v-list-item-title>
              </v-list-item-content>
            </v-list-item></router-link>
            <v-menu open-on-hover bottom offset-x transition="slide-x-transition">
            <template v-slot:activator="{ on }">
            <v-list-item link v-on="on">
              <v-list-item-content>
                <v-list-item-title class="subtitle-1 font-weight-medium">Internal <v-icon class="menu-icon">keyboard_arrow_right</v-icon></v-list-item-title>
              </v-list-item-content>
            </v-list-item>
            </template>
              <v-list color="#F0FAFE">
                <v-menu open-on-hover bottom offset-x transition="slide-x-transition">
                <template v-slot:activator="{ on }">
                  <v-list-item link v-on="on">
                  <v-list-item-content>
                    <v-list-item-title class="subtitle-1 font-weight-medium">Director's Orders <v-icon class="menu-icon">keyboard_arrow_right</v-icon></v-list-item-title>
                  </v-list-item-content>
                </v-list-item>
                </template>
                  <v-list
                  color="#F0FAFE"
                  v-for="(item, index) in Orders"
                  :key="index"
                  >
                    <router-link :to="'/' + item.title"><v-list-item link>
                      <v-list-item-content>
                        <v-list-item-title class="subtitle-1 font-weight-medium">{{ item.title }}</v-list-item-title>
                      </v-list-item-content>
                    </v-list-item></router-link>
                  </v-list>
                </v-menu>
                <router-link to="/Other"><v-list-item link>
                  <v-list-item-content>
                    <v-list-item-title class="subtitle-1 font-weight-medium">Other</v-list-item-title>
                  </v-list-item-content>
                </v-list-item></router-link>
              </v-list>
            </v-menu>
          </v-list>
      </v-menu>

和一点免责声明。是的，我知道这种类型的菜单不是 Material Design 菜单，它是 vuetify 的基础