Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
2.2k views
in Technique[技术] by (71.8m points)

antd table组件如何动态渲染columns 表头为日期时间,列为数据,后台返回的数据为二维数组

image.png
有多个省份,需要表头为时间,列为数量,请问一下这种数据改怎么渲染,求指教
image.png
大概是这种效果,试了很多方法,渲染的数据并不正确,该怎么办呢


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

这个方法得确保每条数据的 dataNum 都是一样的,不然可能有数据丢失的情况。

const dateCloumn = dataSource[0].map(t => ({
    title: t.accountBindTime,
    key: t.accountBindTime,
    render: (text, record) => {
        const target = record.dataNum.find(item => item.accountBindTime === t.accountBindTime)
        return <span>{target ? target.count : ""}</span>
    }
}))

const cloumn = [{
    title: "省份",
    dataIndex: "provinceName"
},...dateCloumn]

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...