React: получение неожиданной ошибки токена в компоненте render () в классе [duplicate]

С React> 16 вы можете использовать response-composite .

import { Composite } from 'react-composite';

// ...

{[1,2,3].map((n) => (
  <Composite>
    <h2>Title {n}</h2>
    <p>Description {n}</p>
  </Composite>
))};

Конечно, должен быть установлен состав-ответ.

npm install react-composite --save

Начиная с версии React v16.0.0, можно возвращать несколько элементов, обернув их внутри Array

render() {
  return (
    {[1,2,3].map(function (n) {
      return [
        <h3>Item {n}</h3>.
        <p>Description {n}</p>
      ]
    }}
  );
}

Также из React v16.2.0 появилась новая функция под названием React Fragments , который вы можете использовать для обертывания нескольких элементов

render() {
  return (
    {[1,2,3].map(function (n, index) {
      return (
        <React.Fragment key={index}>
            <h3>Item {n}</h3>
            <p>Description {n}</p>
        </React.Fragment>
      )
    }}
  );
}

В соответствии с документацией:

Общий шаблон в React для компонента для возврата нескольких элементов. Фрагменты позволяют группировать список детей без добавления дополнительных узлов в DOM.

Фрагменты, объявленные с явным синтаксисом, могут иметь ключи. Для этого используется сопоставление коллекции с массивом фрагментов - например, для создания списка описаний:

function Glossary(props) {
  return (
    <dl>
      {props.items.map(item => (
        // Without the `key`, React will fire a key warning
        <React.Fragment key={item.id}>
          <dt>{item.term}</dt>
          <dd>{item.description}</dd>
        </React.Fragment>
      ))}
    </dl>
  );
}

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

Здесь вы можете использовать createFragment.

https://facebook.github.io/react/docs/create-fragment.html

import createFragment from 'react-addons-create-fragment';
...
{[1,2,3].map((n) => createFragment({
    h: <h3>...</h3>,
    p: <p>...</p>
  })
)}

(используя синтаксис ES6 и JSX здесь)

вам сначала нужно добавить пакет react-addons-create-fragment:

npm install --save react-addons-create-fragment

Преимущество решения Jan Olaf Krems: не реагировать жалуются на недостающие key