Как упорядочить каждый элементы в свои блоки?

Есть вот такой json результат

{
 id: 1,
 title: "Новость первая",
 description: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam, tempore?",
 tags: [ "Тег 1", "Тег 2", "Тег 3", "Тег 4", "Тег 5", ]
},

Вывожу элементы все вот таким кодом

const NewsItem = ListNews.map(item => {
 <div key={item.id}>
  <div>{item.title></div>
  <div>{item.description}</div>
  <div>
    <ul>
      <li>{item.tags}</li>
    </ul>
  </div>
 </div>
})

const News = () => {
 {NewsItem}
}

Я знаю что у меня выводится всё в виде сплошного текста в теге <LI></LI> А как сделать так что бы каждый элемент был в своем теге li?


Ответы (1 шт):

Автор решения: SwaD

Вам необходимо пробежаться методом .map() и вывести значения массива tags:

const NewsItem = ListNews.map(item => {
  <div key={item.id}>
    <div>{item.title}></div>
    <div>{item.description}</div>
    <div>
      <ul>
        {item.tags.map(it => <li>{it}</li>)}
      </ul>
    </div>
  </div>
})
→ Ссылка