سلام دوستان. فرض کنید من یه تگ خالی ul در فایل html و یه object در فایل js به این شکل زیر دارم:
let data = {
"key1": ["item"],
"key2": ["item", "item", "item"],
"key3": ["item", "item"],
}
میخوام به ازای هر item در data (که در اینجا سه تا هستن)، یه تگ li بسازم. حالا میخوام دو تگ span هم بسازم و در span اولی، key هر item قرار بگیره و در span دومی هم تمام item هایی که در آرایه ی مربوط به key هستن قرار بگیرن.
بطوری که اگه بخوایم خروجی نهایی رو ببینیم، به این صورت باید باشه:
<ul>
<li>
<span>key1:</span>
<span>item</span>
</li>
<li>
<span>key2:</span>
<span>item, item, item</span>
</li>
<li>
<span>key3:</span>
<span>item, item</span>
</li>
</ul>
خیلی ممنون میشم راهنماییم کنید که چطور میتونم این رو پیاده سازی کنم
ببین اول تو نیاز داری که تو ابجکت حلقه بندازی که این با این تیکه کد زیر انجام میشه و key هارو به شکل حلقه برات در میاره
for ( itemObject in data ){
console.log(itemObject)
}
حالا با map یا For یا foreach میتونی یه حلقه دیگ هم توی دارایی های هر key بندازی که میشه به صورت کلی مثل زیر :
for ( itemObject in data ){
data[itemObject].map(item=>console.log(item))
}
حالا میمنونه که چطور دلت مخیخواد استفاده کنی اگر تو ری اکت و از jsx استفاده میکنی که خیلی راحته اگر هم با js خالی داری انجامش میدی میتونی از createElemnt استفاده کنی ، نیاز داشتی بگو بیشتر شرح بدم
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟