如何在Vuetify上创建嵌套菜单？

<template>
  <v-app>
    <v-menu offset-y>
      <template v-slot:activator="{ on }">
        <v-btn v-on="on">Open menu</v-btn>
      </template>
      <v-list>
        <v-list-item-group>
          <v-list-item v-for="item in menuItems" :key="item.title">
            <v-list-item-title>
              {{ item.title }}
            </v-list-item-title>
            <v-list-item-group v-if="item.children">
              <v-list-item v-for="child in item.children" :key="child.title">
                <v-list-item-title>
                  {{ child.title }}
                </v-list-item-title>
              </v-list-item>
            </v-list-item-group>
          </v-list-item>
        </v-list-item-group>
      </v-list>
    </v-menu>
  </v-app>
</template>

<script>
export default {
  data() {
    return {
      menuItems: [
        {
          title: "Item 1",
        },
        {
          title: "Item 2",
          children: [
            { title: "Subitem 2.1" },
            { title: "Subitem 2.2" },
            { title: "Subitem 2.3" },
          ],
        },
        {
          title: "Item 3",
        },
      ],
    };
  },
};
</script>