美文网首页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