美文网首页Ant Design
Antd Vue:table中使用customRender 自定

Antd Vue:table中使用customRender 自定

作者: 东方晓 | 来源:发表于2022-12-12 15:24 被阅读0次

    2022-12-12 周一

    文档

    文档

    customRender属性是一个方法,可接收三个参数(val,row,index),分别是当前值、当前行数据和当前索引。

    columns:[
      {
        title: 是否xx',
        dataIndex: 'status',
        customRender: (text) => {
            return <a-tag color={text === '1'?'blue':'green'}>{text}</a-tag>
        }
      },
      {
        title: '交易状态',
        dataIndex: 'tradeState',
        customRender: (state) => {
          return state === 1 ? '交易完成' : (state === 0 ? '等待交易' : '交易失败')
        }
      },
      {
        title: '交易时间',
        dataIndex: 'tradeTime',
        customRender: (time) => moment(time).format('YYYY-MM-DD HH:mm:ss')
      }
    ]
    

    相关文章

      网友评论

        本文标题:Antd Vue:table中使用customRender 自定

        本文链接:https://www.haomeiwen.com/subject/jsmfqdtx.html