Javascript react _this2.setState不是函数-可能存在绑定问题

我是一个全新的反应者，我一直在努力找出是什么原因导致了chrome控制台出现这个错误

bundle.js:15316未捕获（承诺中）类型错误：_this2.setState不是函数

我正在尝试用facebook简单地登录到一个webapp，以了解登录流程

我已经在

/

上设置了登录名（还有我的

主页

页面路径）。我不认为问题出在路线或其他方面。这似乎是

react

中的

绑定

的一个问题，而且是这个框架的新手-我很难找到解决方法

我的

/

或

主页
路线
jsx
如下所示

import React, { Component } from "react";
import { browserHistory } from 'react-router';
import FacebookLogin from 'react-facebook-login';


export default class Home extends Component {

    constructor() {
        super();
        this.state = { isAuthenticated: false, user: null, token: ''};
        this.setInputState = this.setInputState.bind(this);
    }

    /*logout = () => {
        this.setState({isAuthenticated: false, token: '', user: null})
    };*/

    responseFacebook(response) {
      console.log(response)
      const accessTokenBlob = new Blob([JSON.stringify({input_token: response.accessToken}, null, 2)], {type : 'application/json'});
      const options = {
          method: 'POST',
          body: accessTokenBlob,
          //mode: 'cors',
          cache: 'default'
      };
      fetch('http://localhost:8880/auth/facebook', options)
          .then((r) => r.json())
          .then(r => {
            console.log(r)
            if (r.status) {
                this.setState({isAuthenticated: true, user: response.id, token: response.accessToken})
            }
      });
    }

    componentDidMount() {
        browserHistory.push('/');
    }
    render() {
        console.log(this.state)
        let content = this.state.isAuthenticated ?
        (
            <div>
                <p>Authenticated</p>
                <div>
                    {this.state.user.name}
                </div>
                <div>
                    <button onClick={this.logout} className="button">
                        Log out
                    </button>
                </div>
            </div>
        ) : (
            <div>
            <FacebookLogin
                appId="2128489194096154"
                autoLoad={true}
                fields="name,id,picture"
                scope="public_profile"
                callback={this.responseFacebook} />
            </div>
        );
        return (
            <div className="App">
                {content}
            </div>
        );
    }
}

我已经在这里呆了将近一天了，我完全迷路了——读了几篇文章——什么地方都没有得到。由于我一直在努力解决这个问题，如果问题不清楚-请让我知道我可以添加更多的细节


编辑#1

http://localhost:8880/auth/facebook
这是我编写的后端，这是我可以控制的。后端的响应日志和前端接收的数据相同。这说明
cors
或其他集成问题没有问题。
responseFacebook
函数未绑定到
类
上下文。因此
这个
函数在
responseFacebook
中没有引用
类
。您可以像这样使用箭头函数

responseFacebook = (response) => {

    constructor() {
        super();
        this.state = { isAuthenticated: false, user: null, token: ''};
        this.setInputState = this.setInputState.bind(this);
        this.responseFacebook = this.responseFacebook.bind(this);
    }

或者您可以像这样显式地
绑定
构造函数中的函数

responseFacebook = (response) => {

    constructor() {
        super();
        this.state = { isAuthenticated: false, user: null, token: ''};
        this.setInputState = this.setInputState.bind(this);
        this.responseFacebook = this.responseFacebook.bind(this);
    }

在包含此
callback={this.responseFacebook}的行上使用如下箭头函数
responseFacebook=（response）=>{
/>
也绑定responsefacebook函数。谢谢@PrakashSharma-你的解决方案似乎对我有效。你知道我为什么会出现这个错误吗？你第一次使用
箭头函数时出现了
？/src/components/views/home.jsx模块构建失败：
错误。/src/components/views/home.jsx模块构建失败：语法错误：意外令牌（23:21）21}*/22 |>23 |响应书=（响应）=>{| ^
你的第二种方法对我很有效，我理解了问题所在，也更好地学习了语义。谢谢你的帮助。但我非常好奇为什么箭头函数对我不起作用，任何帮助/指导都将不胜感激。@sudhishkr它显示语法错误。你确定你的语法正确吗是正确的吗？你能在将其更改为箭头功能后显示代码吗？代码共享链接：（24小时后过期-因为我不想修改我的问题）酷，不用担心，我会继续在这方面挖掘。你解决了我的问题..谢谢你的帮助。为这个问题选择你的答案