2 回答

TA貢獻(xiàn)1820條經(jīng)驗(yàn) 獲得超9個(gè)贊
執(zhí)行此操作的一種方法是在每個(gè)對(duì)象中添加 date 屬性。container
你在你的問(wèn)題中沒(méi)有提到它,但通過(guò)這個(gè)例子,我理解你要求日期每天增加。為此,您可以將N天添加到當(dāng)前日期,請(qǐng)查看以下示例,addDays函數(shù)將每個(gè)參數(shù)花費(fèi)的天數(shù)添加到今天
const container = [
{
item: 1,
date: new Date(),
},
{
item: 2,
date: addDays(1),
},
{
item: 3,
date: addDays(2),
},
{
item: 4,
date: addDays(3),
},
];
function addDays(day) {
const date = new Date();
date.setDate(date.getDate() + day);
return date;
}
console.log(container);
更新 0
// container state after fetching data
const container = [
{
item: 1,
},
{
item: 2,
},
{
item: 3,
},
{
item: 4,
},
];
// container state after transform
const list = container.map((entry) => ({
...entry,
date: addDays(entry.item),
}));
function addDays(day) {
const date = new Date();
date.setDate(date.getDate() + day);
return date;
}
console.log(list);
更新 1
為了格式化日期,您可以嘗試類(lèi)似這樣的東西
function format(date) {
const month = date.getMonth()
const day = date.getDate()
return `${month}-${day}`;
}
并以這種方式調(diào)用格式方法
function addDays(day) {
const date = new Date();
date.setDate(date.getDate() + day);
return format(date);
}
您可以在這個(gè)超級(jí)受歡迎的問(wèn)題中閱讀有關(guān)日期格式的信息
然后在 react 容器列表中,它變得簡(jiǎn)單
<div>
{container.map((t) => (
<div className="box">
<span>{t.item}</span>
<span>{t.date}</span>
</div>
))}
</div>;

TA貢獻(xiàn)1856條經(jīng)驗(yàn) 獲得超5個(gè)贊
您可以使用此函數(shù)生成隨機(jī)日期
function randomDate(start, end) {
return new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
}
//result
const myRandomDate = randomDate(new Date(2020, 6, 8), new Date())
console.log(myRandomeDate)
將日期添加到對(duì)象列表中
const newContainer =[]
container.forEach(c=>{
newContainer.push( { item:c.item , date:randomDate(new Date(2020, 6, 8), new Date()) })
})
添加回答
舉報(bào)