el-table 对循环产生的空白列赋默认值

1. el-table 空白列赋值

对el-table中未传数据存在空白的列赋默认值0。使用el-table 提供的插槽 slot-scope:{{ row || '0' }}

原数据:

html 复制代码
<el-table-column label="集镇"  :prop=city >
     <template slot-scope="{row}">
         {{ row || '0' }}
       </template>
</el-table-column>

2.el-table 对循环产生的空白列赋值

对于循环产生的列,仍要赋默认值0,可采用以下方式: {{ row[col.city] || '0' }}

原数据:

html 复制代码
<template v-for="col in cols">
   <el-table-column :label=col.label>
     <el-table-column label="集镇" :prop=col.city >
       <template slot-scope="{row}">
         {{ row[col.city] || '0' }}
       </template>
     </el-table-column>
     <el-table-column label="农村" :prop=col.village>
       <template slot-scope="{row}">
         {{ row[col.village] || '0' }}
       </template>
     </el-table-column>       
   </el-table-column>
</template>

问题解决:

相关推荐
竹林81820 小时前
RainbowKit 快速集成多链钱包连接:从“连不上”到丝滑切换的踩坑实录
前端·javascript
Ruihong21 小时前
你的 Vue 3 reactive(),VuReact 会编译成什么样的 React?
vue.js·面试
Ruihong21 小时前
你的 Vue 3 ref(),VuReact 会编译成什么样的 React?
vue.js·面试
一 乐21 小时前
酒店预订|基于springboot + vue酒店预订系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·酒店预订系统
嗜好ya21 小时前
解决 Vite 项目中 import.meta.env 变量为 undefined 的问题
前端·javascript·vue.js
心连欣21 小时前
JS算法入门:图解“冒泡排序”,彻底搞懂双重循环的奥义
前端·javascript
浩星1 天前
「Vue3 + Cesium 最佳实践」完整工程化方案
前端·javascript·vue.js
小李子呢02111 天前
前端八股Vue(5)---v-if和v-show
前端·javascript·vue.js
YiuChauvin1 天前
vue2中使用 AntV G6
javascript·vue.js
踩着两条虫1 天前
目录:VTJ.PRO 在线应用开发平台技术揭秘
vue.js·低代码·ai编程