Skip to content

展示渲染器(displayAs)

展示渲染器决定 Cell 在 display 模式下的渲染方式。

渲染器列表

displayAs渲染效果说明
text纯文本默认,直接输出值
number千分位格式化数字1234567 → 1,234,567
currency货币符号 + 格式化金额1234.5 → ¥1,234.50
tagElement Plus Tag 组件配合字典映射颜色
status圆点 + 文字适合状态类字段
date格式化日期字符串按 format 格式化
image缩略图(可预览)单图/多图,支持画廊预览
file文件展示文件名 + 图标 + 下载按钮
link可点击超链接带 target 配置
copy文字 + 复制按钮点击复制到剪贴板
progress进度条Element Plus Progress
detail详情按钮按钮/链接,点击弹出详情弹窗

tag / status 颜色查找优先级

  1. cellProps.colors 中的显式映射
  2. dict 项中的 color 字段
  3. 无匹配时使用默认色(info

合法的 displayAs 覆盖组合

并非所有 cell 类型都能搭配任意 displayAs。下表列出了合法的组合(✅ 表示可用):

cell \ displayAstextnumbercurrencytagstatusdateimagefilelinkcopyprogressdetail
text
number
currency
enum
boolean
datetime
dateRange
image
file
link
detail

注意

非法组合在开发模式下会触发警告,并回退到 Cell 类型的默认渲染器。

Released under the MIT License.