vue 使用 el-descriptions 数据 [ {name:"yasw",state:"0",old:"1"}, {name:"yasw1",state:"0",old:"1"}, {name:"yasw2",state:"0",old:"1"}, {name:"yasw3",state:"0",old:"1"}, {name:"yasw4",state:"0",old:"1"} ],写一个一行三列，一行的label分别为名称，初期，末期的示例

可以这样写：

<el-descriptions :bordered="true" :column="3">
  <el-descriptions-item label="名称" v-for="item in data" :key="item.name">{{ item.name }}</el-descriptions-item>
  <el-descriptions-item label="初期" v-for="item in data" :key="item.name">{{ item.state }}</el-descriptions-item>
  <el-descriptions-item label="末期" v-for="item in data" :key="item.name">{{ item.old }}</el-descriptions-item>
</el-descriptions>

其中，`:bordered="true"` 用于显示边框，`:column="3"` 用于设置列数为3。

`<el-descriptions-item>` 用于添加每个项目，`label` 属性用于设置项目的名称，`v-for` 循环遍历数据，`:key` 属性用于设置循环的唯一标识符。在示例中，我们分别添加了3个 `<el-descriptions-item>`，分别对应名称、初期和末期，使用 `v-for` 循环遍历数据，根据数据中的属性来填充相应的值。

相关问题

vue 使用 el-descriptions 数据 [ {name:"yasw",state:"0",old:"1"}, {name:"yasw1",state:"0",old:"1"}, {name:"yasw2",state:"0",old:"1"}, {name:"yasw3",state:"0",old:"1"}, {name:"yasw4",state:"0",old:"1"} ],写一个一行三列，label分别为名称，初期，末期的示例

可以这样写：

<el-descriptions :bordered="true" :column="3">
  <el-descriptions-item label="名称" v-for="item in data" :key="item.name">{{ item.name }}</el-descriptions-item>
  <el-descriptions-item label="初期" v-for="item in data" :key="item.name">{{ item.state }}</el-descriptions-item>
  <el-descriptions-item label="末期" v-for="item in data" :key="item.name">{{ item.old }}</el-descriptions-item>
</el-descriptions>

其中 `data` 是你提供的数据数组。这样写就可以实现一行三列，每列分别为名称、初期和末期，每行对应数据数组中的一个元素。

vue 使用 el-descriptions 一行三个重复多行

你可以通过使用 `el-row` 和 `el-col` 栅格布局组件，将 `el-descriptions` 放在 `el-col` 中，再将多个 `el-col` 放在同一个 `el-row` 中，从而实现一行显示多个 `el-descriptions`，并重复多行的效果。具体代码如下：

<template>
  <div>
    <el-row>
      <el-col :span="8"><el-descriptions :title="'用户信息'" :bordered="true" :column="1" :size="'small'">
          <el-descriptions-item :label="'姓名'" :content="'张三'"></el-descriptions-item>
          <el-descriptions-item :label="'性别'" :content="'男'"></el-descriptions-item>
          <el-descriptions-item :label="'年龄'" :content="18"></el-descriptions-item>
        </el-descriptions>
      </el-col>
      <el-col :span="8"><el-descriptions :title="'用户信息'" :bordered="true" :column="1" :size="'small'">
          <el-descriptions-item :label="'姓名'" :content="'李四'"></el-descriptions-item>
          <el-descriptions-item :label="'性别'" :content="'女'"></el-descriptions-item>
          <el-descriptions-item :label="'年龄'" :content="20"></el-descriptions-item>
        </el-descriptions>
      </el-col>
      <el-col :span="8"><el-descriptions :title="'用户信息'" :bordered="true" :column="1" :size="'small'">
          <el-descriptions-item :label="'姓名'" :content="'王五'"></el-descriptions-item>
          <el-descriptions-item :label="'性别'" :content="'男'"></el-descriptions-item>
          <el-descriptions-item :label="'年龄'" :content="22"></el-descriptions-item>
        </el-descriptions>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="8"><el-descriptions :title="'用户信息'" :bordered="true" :column="1" :size="'small'">
          <el-descriptions-item :label="'姓名'" :content="'赵六'"></el-descriptions-item>
          <el-descriptions-item :label="'性别'" :content="'女'"></el-descriptions-item>
          <el-descriptions-item :label="'年龄'" :content="25"></el-descriptions-item>
        </el-descriptions>
      </el-col>
      <el-col :span="8"><el-descriptions :title="'用户信息'" :bordered="true" :column="1" :size="'small'">
          <el-descriptions-item :label="'姓名'" :content="'钱七'"></el-descriptions-item>
          <el-descriptions-item :label="'性别'" :content="'男'"></el-descriptions-item>
          <el-descriptions-item :label="'年龄'" :content="28"></el-descriptions-item>
        </el-descriptions>
      </el-col>
      <el-col :span="8"><el-descriptions :title="'用户信息'" :bordered="true" :column="1" :size="'small'">
          <el-descriptions-item :label="'姓名'" :content="'孙八'"></el-descriptions-item>
          <el-descriptions-item :label="'性别'" :content="'女'"></el-descriptions-item>
          <el-descriptions-item :label="'年龄'" :content="30"></el-descriptions-item>
        </el-descriptions>
      </el-col>
    </el-row>
  </div>
</template>

在上述代码中，我们使用 `el-row` 和 `el-col` 组件将 `el-descriptions` 组件进行布局，通过设置 `:span` 属性控制每个 `el-col` 的宽度，从而实现一行显示多个 `el-descriptions` 的效果。同时，我们在每个 `el-descriptions` 组件中设置了不同的数据，以达到重复多行的效果。