qidao123.com ToB IT社区-企服评测·应用市场»论坛 › 物联网/工业互联网 › 物联网 › el-descriptions-item使用span占行不见效

el-descriptions-item使用span占行不见效

[复制链接]
发表于 2025-1-11 04:18:49 | 显示全部楼层 |阅读模式

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要 登录 才可以下载或查看，没有账号？立即注册

×
需要实现的结果是客户状态单独占满一行


错误代码：
  1. <el-descriptions title="基本信息" :column="3">
  2. <el-descriptions-item label="公司电话:">Suzhou</el-descriptions-item>
  3.     <el-descriptions-item label="批次号:">Suzhou</el-descriptions-item>
  4.     <el-descriptions-item label="借款笔数:">Suzhou</el-descriptions-item>
  5.     <el-descriptions-item label="放款时间:">Suzhou</el-descriptions-item>
  6.     <el-descriptions-item label="放款金额:">Suzhou</el-descriptions-item>
  7.     <el-descriptions-item :span="3" label="客户状态:">
  8.       <el-tag size="small">School</el-tag>
  9.     </el-descriptions-item>
  10. </el-descriptions>
复制代码
使用span是没有错的，但是用错了位置，出来的结果就是这样


如图可见客户状态已经是在当前行最后一个的位置，那么直接给他设置span是不会见效的，以是要从前面一个元素动手，让放款金额这个元素提前占满2个位置，才可以让客户状态向下排
正确代码：
  1. <el-descriptions title="基本信息" :column="3">
  2. <el-descriptions-item label="公司电话:">Suzhou</el-descriptions-item>
  3.     <el-descriptions-item label="批次号:">Suzhou</el-descriptions-item>
  4.     <el-descriptions-item label="借款笔数:">Suzhou</el-descriptions-item>
  5.     <el-descriptions-item label="放款时间:">Suzhou</el-descriptions-item>
  6.     <el-descriptions-item :span="2" label="放款金额:">Suzhou</el-descriptions-item>
  7.     <el-descriptions-item :span="3" label="客户状态:">
  8.       <el-tag size="small">School</el-tag>
  9.     </el-descriptions-item>
  10. </el-descriptions>
复制代码
只需要在上一个元素上面加上:span="2"就可以了
回复

使用道具 举报

返回列表

东湖之滨
+ 我要发帖

登录后关闭弹窗

登录参与点评抽奖  加入IT实名职场社区
去登录
快速回复 返回顶部 返回列表