Отображение значения свойства объекта, только если оно существует

#javascript #reactjs

#javascript #reactjs

Вопрос:

У меня есть массив объектов, подобных этому, которые отображаются и отображаются.

 const items = [
  {
    id: '1',
    name: 'name',
    comment: 'text',
  },
  {
    id: '2',
    name: 'name',
  },
  etc...
]
 
 var hasComment = items.some(item => item.hasOwnProperty('comment'));

const card = items.map(item => 
        <div key={item.id}>
            <ul className="detail">
                <li>{item.name}</li>
                {hasComment ? <li>{item.comment}</li> : ''}
            </ul>
        </div>
 

Я хочу, чтобы комментарий отображался в зависимости от свойства каждого отдельного объекта. Я погуглил вышеупомянутое решение, но как только какой-либо объект моего массива обладает этим свойством, он отображается для всех, оставляя некоторые пустые элементы списка. Комментарий к каждому отдельному элементу должен отображаться только в том случае, если объект действительно обладает этим свойством.

Надеюсь, понятно, что я имею в виду.

Комментарии:

1. hasComment возвращает true, если какой-либо из элементов имеет комментарий. Вы можете полностью потерять это и вместо hasComment ? того, чтобы просто использовать item.comment ?

2. Ты мой герой, Джеймс! Делает именно то, что я хочу. Спасибо!

Ответ №1:

Вам нужно поставить проверку свойства внутри .filter перед отображением для отображения:

 const card = items
  .filter(item => item.hasOwnProperty('comment')
  .map(item => {
    // ...