<template>
  <div>
    <ul v-for="menu in menus" :key="menu.id">
      <li>
        <span @click="toggleMenu">{{ menu.name }}</span>
        <ul v-if="isMenuOpen">
          <!-- 子菜单内容 -->
        </ul>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isMenuOpen: false,
      menus: [
        { id: 1, name: '菜单1' },
        { id: 2, name: '菜单2' },
        { id: 3, name: '菜单3' },
      ],
    };
  },
  methods: {
    toggleMenu() {
      this.isMenuOpen = !this.isMenuOpen;
    },
  },
};
</script>