Не работает код в примере?

Question

[Марат Шакиров]

Делаю приложение на Реакте, при переборе массива методом map, внутри него я еще перебираю объект с помощью цикла for, и внутри еще условия. Но почему-то ругается на то, что в фигурных скобках цикл for или условия if или switch. Хотя эта конструкция работает вне этого компонента.

<TableBody>
          {cars.map((car, index) => (
            <TableRow key={index}>
              <TableCell>{`${car.mark} ${car.model}`}</TableCell>
              {
                  for (let key in car.tariffs) {
                    switch (key) {
                      case 'Стандарт':‹
                        return <TableCell>{key.year}</TableCell>;
                      case 'Комфорт':
                        return <TableCell>{key.year}</TableCell>;
                      case 'Бизнес':
                        return <TableCell>{key.year}</TableCell>;
                      case 'Комфорт+':
                        return <TableCell>{key.year}</TableCell>;
                      case 'Эконом':
                        return <TableCell>{key.year}</TableCell>;
                      case 'Минивэн':
                        return <TableCell>{key.year}</TableCell>;
                      case 'Лайт':
                        return <TableCell>{key.year}</TableCell>;
                      default:
                        return <TableCell>-</TableCell>;
                    }
                  }
              }
            </TableRow>

Answer 1

[aagzip]

Вам необходимо данный цикл вынести из jsx и в jsx вызывать функцию, которая возвращает результат данного цикла.

Либо переписать данный цикл с использованием map или другого перебирающего метода

Comments

[Марат Шакиров]

А почему этот цикл не работает в jsx?

[aagzip]

Потому что `if` и цикл `for` не являются выражениями в JS, а JSX работает только с выражениями.

https://reactjs.org/docs/jsx-in-depth.html#javascr...

[Марат Шакиров]

aagzip, спасибо большое! Разобрался!