Question

我得到的＆＃39; props.data.map不是函数错误＆＃39;。我也有console.log＆＃39; this.props.data＆＃39;在ResultList中，但不知何故它仍然没有映射。我还尝试了google和stackoverflow中的所有相关链接。

请指教。任何帮助将不胜感激！！谢谢你们:)）

此处的链接显示了响应的屏幕截图： image

var Results = React.createClass({
  getInitialState: function() {
    return {data: []};
  },

  componentDidMount: function() {
    // loading results from server for initialization
    this.loadResultsFromServer();
  },

  loadResultsFromServer: function() {
    superagent
    .get('http://localhost:5000/analyzer')
    .end(function(err, res){
      if (res) {
        console.log(res);
        this.setState({data: res.text});
      } else {
        console.log("error loading results from server: ", err);
      }
    }.bind(this));
  },

  render: function() {
    return (
      <div>
        <ResultList data={this.state.data} />
      </div>
    );
  }
});

var ResultList = React.createClass({
    render: function() {
      var resultNodes = this.props.data.map(function (result) {
        return (
          <Result name={result.Name}>
            {result.Score}
          </Result>
        );
      });

      return (
        <div>
          {resultNodes}
        </div>
      );
    }
});

Answer 1

看起来你的res.text是一个字符串，而不是一个数组。这意味着它不具有.map功能。如果这是你的API返回的响应，你需要在设置状态时调用JSON.parse，即：

this.setState({ data: JSON.parse(res.text) });

未捕获的TypeError：this.props.data.map不是函数（使用superagent）

1 个答案: