未捕获类型错误:this.props.data.map不是函数(使用超级代理）

Uncaught TypeError: this.props.data.map is not a function (using superagent)

本文关键字：函数 代理 map 类型 错误 data props this      更新时间：2023-09-26

我得到的是"props.data.map不是函数错误"。我还在ResultList中console.log"this.props.data"，但不知怎么的，它仍然没有映射。我还尝试了谷歌和stackoverflow中的所有相关链接。

请告知。任何帮助都将不胜感激！！谢谢大家：）

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

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

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

this.setState({ data: JSON.parse(res.text) });
相关文章：