elementplus设置描述列表为竖向

Element Plus是一个Vue 3的UI组件库，它提供了一个名为`el-description-list`的组件，用于创建描述列表。如果你想将这个描述列表设置为竖向排列，你可以通过调整其默认样式或直接传递自定义属性来实现。

默认情况下，`el-description-list`的项通常是水平排列的，但你可以通过CSS覆盖它的样式，将其`.el-description-item`下的`flex-direction`属性设置为`column`，使其变为垂直布局。例如：

<template>
  <el-description-list :class="{'vertical': isVertical}" v-model="data">
    <el-description-item v-for="(item, index) in data" :key="index">
      <span>{{ item.title }}</span>
      <span>{{ item.description }}</span>
    </el-description-item>
  </el-description-list>
</template>

<script setup>
import { ref } from 'vue';

const isVertical = ref(false);
const data = [
  // 描述列表数据...
];
</script>

<style scoped>
.vertical .el-description-item {
  flex-direction: column;
}
</style>

在这个例子中，`isVertical`是一个响应式的变量，当它为`true`时，描述列表就会变成竖向的。你可以根据需要动态改变这个值。