antd组件自定义table单元格内容样式

阳光穿透心脏的1/2处 2022-10-11 00:59 174阅读 0赞

效果

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyOTYzODQx_size_16_color_FFFFFF_t_70

判断数据的值修改显示字体的颜色

在使用 columns 时，可以通过scopedSlots属性配置支持 slot-scope 的属性。

  1. <a-table :columns="columns" :data-source="data" :scroll="{ x: 1500,y:400}" rowKey="序号">
  2.     <div slot="日常剔除比例" slot-scope="text" style="color: red;" v-if=" text > 13">{
  3.    { text }}%</div>
  4.     <div slot="日常剔除比例" slot-scope="text" v-else>{
  5.    { text }}%</div>
  6. </a-table>
  8. {
  9.     title: '日常剔除比例',
  10.     dataIndex: '日常剔除比例',
  11.     key: '日常剔除比例',
  12.     width: 120,
  13.     scopedSlots: { customRender: '日常剔除比例' },
  14. }

发表评论

表情：
评论列表 （有 0 条评论，174人围观）

还没有评论，来说两句吧...

相关阅读

    相关 【Excel】设置自定义单元格格式

    我们知道Excel中设置单元格格式时可以通过自定义方式设置格式，但是具体如何使用一般人都不是很清楚，其实自定义功能非常强大。本文主要介绍一下自定义单元格格式的小技巧，主要流程：

    Bertha 。Bertha 。/ 0 赞/ 533 阅读