无法将Symbol值转换为字符串 - React AJAX删除请求

Question

我无法弄清楚为什么这会在控制台中抛出Cannot convert a Symbol value to a string。我正在使用React v15和jQuery v3。

这是我的React代码：

var CommentList = React.createClass({
  handleDelete: function(comment) {
    console.log(comment);
    $.ajax({
      url: this.props.url,
      dataType: 'json',
      type: 'DELETE',
      data: comment,
      contentType:'application/json',
      dataType: 'text',
      success: function(data) {
        this.setState({ data: data });
      }.bind(this),
      error: function(xhr, status, err) {
        this.setState({data: comments});
        console.error(this.props.url, status, err.toString());
      }.bind(this)
    })
  },
  render: function() {
    var commentNodes = this.props.data.map(comment => {
      return(
        <div key= { comment.id }>
          <Comment author = { comment.author }>
            { comment.text }
          </Comment>
          <button onClick={this.handleDelete}>delete</button>
        </div>
      );
    });
    return (
      <div className="commentList">
        {commentNodes}
      </div>
    );
  }
});

json文件如下所示：

[
    {
        "id": 1388534400000,
        "author": "Pete Hunt",
        "text": "Hey there!"
    },
    {
        "id": 1323434400000,
        "author": "Ben Jerry",
        "text": "I did a thing"
    },
    ...
    ...
]

Answer 1

您没有将评论传递给handleDelete，它实际上是在接收点击事件。你可能只需使用评论ID就可以逃脱。试试这个列表渲染器：

<div key= {comment.id}>
  <Comment author ={comment.author}>
    {comment.text}
  </Comment>
  <button onClick={this.handleDelete.bind(this, comment)}>delete</button>
</div>