第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何為數(shù)組中的每個(gè)元素創(chuàng)建唯一的日期?

如何為數(shù)組中的每個(gè)元素創(chuàng)建唯一的日期?

郎朗坤 2022-09-23 21:31:42
我正在制作 React 應(yīng)用程序,我有這樣的問(wèn)題:例如,我有一個(gè)數(shù)組,它看起來(lái)像這樣:containerconst container = [ {item: '1'}, {item: '2'}, {item: '3'}, {item: '4'}]然后我想在html 4列中制作,每個(gè)列都有一個(gè)值。所以我正在使用這個(gè):<div> {container.map(t =>  <div className='box'>{t.item}</div> )}</div>因此,它將生成具有不同值的 4:div1/2/3/4現(xiàn)在我的問(wèn)題在這里:如何為每個(gè)日期(從toda到...)制作自己的日期?box第一項(xiàng) = 6 月 8 日,星期一第二個(gè)項(xiàng)目 = 6月9日,星期二等。我做了這樣的事情,但它只顯示當(dāng)前日期,bu我需要顯示從今天開(kāi)始的接下來(lái)幾天:8,9,10,11等(最后一個(gè)日期沒(méi)關(guān)系,它可以是6月25日)let x = new Date();let fullDate = x.toLocaleString('en-gb', { day:'numeric' , weekday: 'long', month: 'long' });附言:當(dāng)我使用它時(shí),它會(huì)在每列中顯示所有日期。for
查看完整描述

2 回答

?
慕妹3146593

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>;


查看完整回答
反對(duì) 回復(fù) 2022-09-23
?
RISEBY

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()) })

})


查看完整回答
反對(duì) 回復(fù) 2022-09-23
  • 2 回答
  • 0 關(guān)注
  • 114 瀏覽
慕課專(zhuān)欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)