React JS отображает данные списка в отдельной строке

Question

У меня проблема в React Js. Я хочу отображать данные об именах в каждой отдельной строке.

  const names = ['James', 'John', 'Paul', 'Ringo'[![\]][1]][1];

Мой код:

return (
<div class="col-lg-8 bar-name">
  <div>
    {names.map(filteredName => (
      <li>
        {filteredName}
      </li>
    ))}
  </div>
</div>)

Как я могу использовать в элементе div? Что делать?

может ли кто-нибудь мне помочь?

Answer 1

Вам необходимо добавить элементы, которые будут отображаться рядом в теге List. Пример:

return (
<div class="col-lg-8 bar-name">
  <div>
    {names.map(filteredName => (
      <li>
        {filteredName} 
       <div>
        Ryan
       </div>
       <div>
        Eric
       </div>
      </li>
    ))}
  </div>

)