怎么让el-sub-menu不收起来

### 回答1：
要让el-sub-menu不收起来，你可以通过以下两种方法之一来实现：

1. 使用触发器来控制el-sub-menu的展开和收起：

在el-sub-menu组件上添加一个属性`trigger="hover"`，这样当鼠标移动到el-sub-menu上时，它会自动展开。然后，在el-sub-menu的内容中添加一个事件监听器，当鼠标移开时，将el-sub-menu收起。

示例代码：

<template>
  <el-menu>
    <el-submenu trigger="hover">
      <template slot="title">菜单一</template>
      <el-menu-item>选项1</el-menu-item>
      <el-menu-item>选项2</el-menu-item>
      <el-menu-item>选项3</el-menu-item>
      <el-menu-item>选项4</el-menu-item>
      <el-menu-item>选项5</el-menu-item>
      <el-menu-item>选项6</el-menu-item>
      <el-menu-item>选项7</el-menu-item>
      <el-menu-item>选项8</el-menu-item>
      <el-menu-item>选项9</el-menu-item>
      <el-menu-item>选项10</el-menu-item>
      <el-menu-item>选项11</el-menu-item>
    </el-submenu>
  </el-menu>
</template>

<script>
export default {
  methods: {
    handleClose() {
      this.$refs.menu.collapse();
    }
  }
};
</script>

2. 使用v-show来控制el-sub-menu的展开和收起：

在el-sub-menu组件上添加一个属性`v-show="showSubMenu"`，这样el-sub-menu将根据`showSubMenu`的值来展开或收起。然后，在el-sub-menu的父组件中添加一个事件监听器，当鼠标移开时，将`showSubMenu`设置为`false`，从而将el-sub-menu收起。

示例代码：

<template>
  <el-menu>
    <el-submenu v-show="showSubMenu" @mouseleave="handleClose">
      <template slot="title">菜单一</template>
      <el-menu-item>选项1</el-menu-item>
      <el-menu-item>选项2</el-menu-item>
      <el-menu-item>选项3</el-menu-item>
      <el-menu-item>选项4</el-menu-item>
      <el-menu-item>选项5</el-menu-item>
      <el-menu-item>选项6</el-menu-item>
      <el-menu-item>选项7</el-menu-item>
      <el-menu-item>选项8</el-menu-item>
      <el-menu-item>选项9</el-menu-item>
      <el-menu-item>选项10</el-menu-item>
      <el-menu-item>选项11</el-menu-item>
    </el-submenu>
  </el-menu>
</template>

<script>
export default {
  data() {
    return {
      showSubMenu: false
    };
  },
  methods: {
    handleClose() {
      this.showSubMenu = false;
    },
    handleOpen() {
      this.showSubMenu = true;
    }
  }
};
</script>

以上两种方法都可以实现el-sub-menu不收起来的效果，你可以根据自己的需要选择其中一种。

### 回答2：
要让el-sub-menu不收起来，可以通过以下几种方法实现。

1. 使用v-if指令：在el-sub-menu组件上添加一个控制变量，用于判断是否需要展开子菜单。当需要展开时，将该变量设置为true，子菜单就会保持展开状态；当不需要展开时，将该变量设置为false，子菜单就会收起。通过控制变量的值来动态地决定子菜单的展开与收起。

2. 使用v-show指令：与v-if类似，也可以在el-sub-menu组件上添加一个控制变量，用于控制子菜单的展示与隐藏。不同的是，v-show是通过CSS的display属性来控制元素的显示与隐藏，而不是添加或移除元素。当需要展开子菜单时，将控制变量设置为true，子菜单保持展示；当不需要展开时，将控制变量设置为false，子菜单隐藏。

3. 使用el-menu的default-active属性：通过设置el-menu组件的default-active属性，可以指定默认展开的菜单项。将default-active属性设置为子菜单的索引值或对应的唯一标识符，即可让子菜单一开始就处于展开状态。

以上是几种常见的方法，根据具体需求选择合适的方式来保持el-sub-menu的展开状态。

### 回答3：
要让el-sub-menu不收起来，可以通过以下方法实现。

首先，可以使用Vue的v-model指令将el-sub-menu的展开状态与一个数据变量绑定起来。例如，在data中定义一个名为isSubMenuOpen的属性，用于控制el-sub-menu的展开与收起：

data() {
  return {
    isSubMenuOpen: true
  }
}

然后，在el-sub-menu组件上使用v-model将其展开状态与isSubMenuOpen绑定起来：

<el-sub-menu v-model="isSubMenuOpen">
  ...
</el-sub-menu>

接下来，为了实现不收起的效果，可以在el-sub-menu中添加一个鼠标移入的监听事件，将isSubMenuOpen的值设置为true：

<el-sub-menu v-model="isSubMenuOpen" @mouseenter="isSubMenuOpen = true">
  ...
</el-sub-menu>

这样，在鼠标移入el-sub-menu时，isSubMenuOpen的值会一直保持为true，使得el-sub-menu不会收起。

另外，还可以在el-sub-menu的子菜单项中添加一个鼠标移出的监听事件，将isSubMenuOpen的值设置为false，以便在鼠标移出时收起el-sub-menu：

<el-sub-menu v-model="isSubMenuOpen" @mouseenter="isSubMenuOpen = true" @mouseleave="isSubMenuOpen = false">
  ...
</el-sub-menu>

通过以上方法，可以实现el-sub-menu始终保持展开的效果。需要注意的是，这种方法只是一种示例，具体的实现方式可能需要根据具体的代码结构和需求进行调整。