Vue.js 点击一级标题展开/收缩二级菜单：使用 v-if 或 v-show

可以使用 v-if 或 v-show 来实现点击一级标题后展开和收回二级菜单的效果。

首先，在一级标题的元素上绑定一个点击事件，可以使用 @click 指令。在点击事件中，我们可以通过改变一个变量的值来控制二级菜单的展开和收回。

然后，在二级菜单的元素上使用 v-if 或 v-show 指令来根据变量的值控制显示和隐藏。

下面是一个示例代码：

<template>
  <div>
    <h1 @click='toggleSubMenu'>一级标题</h1>
    <ul v-if='showSubMenu'>
      <li>菜单项1</li>
      <li>菜单项2</li>
      <li>菜单项3</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      title: '一级标题',
      showSubMenu: false
    }
  },
  methods: {
    toggleSubMenu() {
      this.showSubMenu = !this.showSubMenu;
    }
  }
}
</script>

在上面的代码中，一开始我们设置 showSubMenu 为 false，表示二级菜单是收起状态。当点击一级标题时，toggleSubMenu 方法会被调用，将 showSubMenu 的值取反，从而控制二级菜单的显示和隐藏。

注意，v-if 指令会完全销毁和重建元素，而 v-show 指令只是改变元素的 display 样式。如果二级菜单的内容比较复杂，而且经常需要显示和隐藏，可以考虑使用 v-show，以避免重复渲染的性能问题。