首先，设置更安全的初始数据：

getInitialState : function() {
    return {data: {comments:[]}};
},

并确保您的ajax数据。

如果您按照上面的两个说明（例如Demo）进行操作，它应该可以工作。

更新：您可以使用条件语句包装 .map 块。

if (this.props.data) {
  var commentNodes = this.props.data.map(function (comment){
      return (
        <div>
          <h1>{comment.author}</h1>
        </div>
      );
  });
}

我想你忘了改变

data={this.props.data}

到

data={this.state.data}

在 CommentBox 的渲染函数中。我在学习教程时犯了同样的错误。因此整个渲染函数应该看起来像

render: function() {
  return (
    <div className="commentBox">
      <h1>Comments</h1>
      <CommentList data={this.state.data} />
      <CommentForm />
    </div>
  );
}

代替

render: function() {
  return (
    <div className="commentBox">
      <h1>Comments</h1>
      <CommentList data={this.props.data} />
      <CommentForm />
    </div>
  );

您需要在渲染之前放置数据

应该是这样的：

var data = [
  {author: "Pete Hunt", text: "This is one comment"},
  {author: "Jordan Walke", text: "This is *another* comment"}
];

React.render(
  <CommentBox data={data}/>,
  document.getElementById('content')
);

取而代之的是：

React.render(
  <CommentBox data={data}/>,
  document.getElementById('content')
);

var data = [
  {author: "Pete Hunt", text: "This is one comment"},
  {author: "Jordan Walke", text: "This is *another* comment"}
];

错误"Cannot read property 'map' of undefined"，如果有在一个错误会遇到"this.props.data"或没有props.data阵列。

更好地放置条件来检查数组

if(this.props.data){
this.props.data.map(........)
.....
}

我考虑过在taggon对这个问题的回答下发表评论，但是，我觉得对那些对细节感兴趣的人应该有更多的解释。

未捕获的类型错误：无法读取未定义的属性“值”严格来说是 JavaScript 错误。
（请注意， value 可以是任何东西，但对于这个问题， value 是 'map'）

理解这一点至关重要，这样您就可以避免无休止的调试循环。
这个错误很常见，特别是如果刚开始使用 JavaScript（和它的库/框架）。
因为React，这与理解组件生命周期方法有很大关系。

// Follow this example to get the context
// Ignore any complexity, focus on how 'props' are passed down to children

import React, { useEffect } from 'react'

// Main component
const ShowList = () => {
  // Similar to componentDidMount and componentDidUpdate
  useEffect(() => {// dispatch call to fetch items, populate the redux-store})

  return <div><MyItems items={movies} /></div>
}

// other component
const MyItems = props =>
  <ul>
    {props.items.map((item, i) => <li key={i}>item</li>)}
  </ul>


/**
  The above code should work fine, except for one problem.
  When compiling <ShowList/>,
  React-DOM renders <MyItems> before useEffect (or componentDid...) is called.
  And since `items={movies}`, 'props.items' is 'undefined' at that point.
  Thus the error message 'Cannot read property map of undefined'
 */

为了解决这个问题，@taggon 给出了一个解决方案（参见第一个 anwser 或链接）。

解决方案：设置初始/默认值。
在我们的示例中，我们可以items通过声明一个default空数组的值来避免“未定义” 。

为什么？这允许 React-DOM 最初呈现一个空列表。
并且当useEffectorcomponentDid...方法被执行时，组件会被重新渲染为一个填充的项目列表。

// Let's update our 'other' component
// destructure the `items` and initialize it as an array

const MyItems = ({items = []}) =>
  <ul>
    {items.map((item, i) => <li key={i}>item</li>)}
  </ul>