尝试将标记视为函数调用（请参阅文档）。然后第一个变成：

{[1,2,3].map(function (n) {
  return React.DOM.p(...);
})}

第二个：

{[1,2,3].map(function (n) {
  return (
    React.DOM.h3(...)
    React.DOM.p(...)
  )
})}

现在应该很清楚第二个代码段没有意义（在 JavaScript 中不能返回多个值）。您必须将它包装在另一个元素中（很可能是您想要的，这样您还可以提供有效的key属性），或者您可以使用以下内容：

{[1,2,3].map(function (n) {
  return ([
    React.DOM.h3(...),
    React.DOM.p(...)
  ]);
})}

使用JSX语法糖：

{[1,2,3].map(function (n) {
  return ([
    <h3></h3>, // note the comma
    <p></p>
  ]);
})}

您不需要展平结果数组。React 会为你做到这一点。请参阅以下小提琴http://jsfiddle.net/mEB2V/1/。再说一遍：将两个元素包装到一个 div/section 中很可能从长远来看会更好。

似乎Jan Olaf Krems关于返回数组的答案不再适用（也许因为 React ~0.9，正如@dogmatic69 在评论中所写）。

文档说你需要返回一个节点：

JSX 根节点的最大数量

目前，在一个组件的渲染中，你只能返回一个节点；例如，如果您有一个要返回的 div 列表，则必须将组件包装在 div、span 或任何其他组件中。

别忘了 JSX 会编译成普通的 JS；返回两个函数并没有真正的语法意义。同样，不要将一个以上的孩子放在三元组中。

在许多情况下，您可以简单地将内容包装在 a<div>或 a 中<span>。

就我而言，我想返回多个<tr>s。我将它们包裹在一个<tbody>- 一张桌子上可以有多个物体。

从 React 16.0 开始，显然再次允许返回数组，只要每个元素都有一个key：新的渲染返回类型：片段和字符串

React 16.2 允许您使用<Fragment>…</Fragment>或 甚至包围元素列表<>…</>，如果您更喜欢数组：https : //reactjs.org/docs/fragments.html

从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 中的一个常见模式是组件返回多个元素。Fragments 允许您对子项列表进行分组，而无需向 DOM 添加额外的节点。

使用显式 <React.Fragment> 语法声明的片段可能有键。一个用例是将一个集合映射到一个片段数组——例如，创建一个描述列表：

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>
  );
}

key 是唯一可以传递给 Fragment 的属性。将来，我们可能会添加对其他属性的支持，例如事件处理程序。

此外，您可能希望在 React 组件内的某个辅助函数中返回多个列表项。只需返回具有以下key属性的 HTML 节点数组：

import React, { Component } from 'react'

class YourComponent extends Component {
  // ...

  render() {
    return (
      <ul>
        {this.renderListItems()}
      </ul>
    )
  }

  renderListItems() {
    return [
      <li key={1}><a href="#">Link1</a></li>,
      <li key={2}><a href="#">Link2</a></li>,
      <li key={3} className="active">Active item</li>,
    ]
  }
}

更新

使用react片段。这很简单。链接到片段文档。

render() {
  return (
    <>
    {[1,2,3].map((value) => <div>{value}</div>)}
    </>
  );
}

旧答案 - 已过时

随着 React > 16 你可以使用react-composite。

import { Composite } from 'react-composite';

// ...

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

当然，必须安装react-composite。

npm install react-composite --save