elementui列表展开

要实现ElementUI的列表展开，您可以使用ElementUI的Collapse组件和CollapseItem组件结合使用。

首先，您需要在项目中引入ElementUI库。可以通过CDN方式引入，或者在项目中使用npm安装并引入。

接下来，在需要展示列表的地方使用Collapse组件包裹列表项。例如：

<template>
  <div>
    <el-collapse>
      <el-collapse-item title="列表项1" name="item1">
        <!-- 列表项1的内容 -->
      </el-collapse-item>
      <el-collapse-item title="列表项2" name="item2">
        <!-- 列表项2的内容 -->
      </el-collapse-item>
      <el-collapse-item title="列表项3" name="item3">
        <!-- 列表项3的内容 -->
      </el-collapse-item>
    </el-collapse>
  </div>
</template>

在上面的代码中，每个`el-collapse-item`标签表示一个可折叠的列表项。`title`属性用于显示列表项的标题，`name`属性用于标识列表项。

您可以根据实际需求添加或删除`el-collapse-item`标签，每个标签中的内容即为列表项的具体内容。

最后，您还可以通过设置`v-model`来控制默认展开的列表项。例如：

<template>
  <div>
    <el-collapse v-model="activeNames">
      <el-collapse-item title="列表项1" name="item1">
        <!-- 列表项1的内容 -->
      </el-collapse-item>
      <el-collapse-item title="列表项2" name="item2">
        <!-- 列表项2的内容 -->
      </el-collapse-item>
      <el-collapse-item title="列表项3" name="item3">
        <!-- 列表项3的内容 -->
      </el-collapse-item>
    </el-collapse>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeNames: ['item1'] // 默认展开的列表项
    };
  }
};
</script>

在上面的代码中，通过设置`activeNames`属性为`['item1']`，列表项1将默认展开。您可以根据需求修改`activeNames`的值来控制默认展开的列表项。

以上就是使用ElementUI实现列表展开的基本方法。您可以根据具体需求进行相应的样式和功能调整。