Реагировать на карту по массиву для создания списка

Я пытаюсь сопоставить действительно простой массив в реакции, но всегда получаю

Expected an assignment or function call and instead saw an expression  no-unused-expressions

это код

render() {
  const arr = [1, 2, 3, 4, 5];
  return (
    <div>
      <ul>
        <li>{this.state.amount}</li>
        {arr.map((e) => {
          <li key = {e}>
            {e}
          </li>
        })}
      </ul>
    </div>
  );
}

Для меня все выглядит так, как во всех учебниках и примерах, таких как https://reactjs.org/docs/lists-and-keys.html

вы забыли возврат в функции обратного вызова карты, поэтому и получаете ошибку. напишите так: {arr.map((e) => ( <li key = {e}> {e} </li> ))} или добавьте возврат: {arr.map((e) => { return <li key = {e}> {e} </li> })}

— 09.04.2019 07:18

javascript reactjs

09.04.2019 07:09

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

423

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Оператор return отсутствует на карте:

render() {
  const arr = [1, 2, 3, 4, 5];
  return (
    <div>
      <ul>
        <li>{this.state.amount}</li>
        {arr.map((e) => {
          return <li key = {e}>
            {e}
          </li>
        })}
      </ul>
    </div>
  );
}

09.04.2019 07:13

Я думаю, что легче следить за вещами, если map() вызывается в рендере.

render(){
const arr = [1, 2, 3, 4, 5];
let listItem = arr.map(each =>{
    return( 
    <li key = {e}>
        {e}
    </li>)
})
return (
  <div>
    <ul>
      <li>{this.state.amount}</li>
        {listItem} 
    </ul>
  </div>
);

Хорошая мысль, спасибо за отзыв.

— 09.04.2019 08:11

09.04.2019 07:15