我是React的新手,正在尝试编写使用API的应用程序。我不断收到此错误:
TypeError:this.setState不是一个函数
当我尝试处理API响应时。我怀疑此绑定有问题,但我不知道如何解决它。这是我组件的代码:
var AppMain = React.createClass({ getInitialState: function() { return{ FirstName: " " }; }, componentDidMount:function(){ VK.init(function(){ console.info("API initialisation successful"); VK.api('users.get',{fields: 'photo_50'},function(data){ if(data.response){ this.setState({ //the error happens here FirstName: data.response[0].first_name }); console.info(this.state.FirstName); } }); }, function(){ console.info("API initialisation failed"); }, '5.34'); }, render:function(){ return ( <div className="appMain"> <Header /> </div> ); } });
回调是在不同的上下文中进行的。您需要这样做bind才能this在回调内部进行访问:
bind
this
VK.api('users.get',{fields: 'photo_50'},function(data){ if(data.response){ this.setState({ //the error happens here FirstName: data.response[0].first_name }); console.info(this.state.FirstName); } }.bind(this));
编辑:看起来您必须同时绑定init和api调用:
init
api
VK.init(function(){ console.info("API initialisation successful"); VK.api('users.get',{fields: 'photo_50'},function(data){ if(data.response){ this.setState({ //the error happens here FirstName: data.response[0].first_name }); console.info(this.state.FirstName); } }.bind(this)); }.bind(this), function(){ console.info("API initialisation failed"); }, '5.34');