VBEN ADMIN / ANDT个性化TABLE的数据样式

2201_75765221

已于 2024-08-27 22:59:44 修改

阅读量211

点赞数 2

文章标签：前端 javascript 开发语言

于 2024-08-27 22:58:36 首次发布

本文链接：https://blog.csdn.net/2201_75765221/article/details/141614535

版权

使用vben Admin 的框架，想basictable 内的数据，做一些逻辑判断，进行各性化显示，采用customRender 返回函数的方法，代码参考如下：

{
    title: '合同总金额',
    dataIndex: 'vat_total',
    width: 100,
    // customRender: ({ text }) => {
    //   return text.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
    // },
    customRender: ({ text }) => {
      const color = parseFloat(text) > 5000 ? 'blue' : 'black';
      return h(
        'span',
        {
          style: { color }
        },
        parseFloat(text).toLocaleString(undefined, {
          minimumFractionDigits: 2,
          maximumFractionDigits: 2,
        })
      );
    },
  },

逻辑是大于5000的显示蓝色：