Reactjs React Native w/TypeScript this.setState不是函数

我目前使用的是React Native 0.39.2 w/latest TypeScript，当我运行componentDidMount（）方法和setState时，我得到了一个错误。setState不是一个函数

我试着和他绑在一起

this.setState（{isLoggedIn:true}）.bind（this）

虽然由于我使用布尔值作为类型，它不允许我不给出类型错误，即使设置为任何类型也会得到相同的错误

这是我的密码

首先是我的状态接口

import React, {
 Component
} from 'react';
import { AppRegistry, View, StyleSheet, Text } from 'react-native';
import { Actions } from 'react-native-router-flux';

import Firestack from 'react-native-firestack';

const firestack = new Firestack();

interface Props {

}

interface State {
  isLoggedIn?: boolean;
}


export default class MainList extends Component<Props, State> {

   state = {
     isLoggedIn: false,
   };

   constructor(props: any) {

      super(props);
      console.log("Is anyone logged in?: " + this.isLoggedIn);

   }

   isLoggedIn = this.state.isLoggedIn;

   componentDidMount() {

      if (!this.isLoggedIn) {

          Actions.welcome();

      }

      firestack.auth.listenForAuth(function(evt: any) {
      // evt is the authentication event
      // it contains an `error` key for carrying the
      // error message in case of an error
      // and a `user` key upon successful authentication

        if (!evt.authenticated) {
        // There was an error or there is no user
        //console.error(evt.error);

        this.setState({isLoggedIn: false});
        console.log("The state of isLoggedIn is: " +       this.isLoggedIn);

        } else {
        // evt.user contains the user details
        console.log('User details', evt.user);

        this.setState({isLoggedIn: true});
        console.log("The state of isLoggedIn is: " + this.isLoggedIn);

        }


    }); 

}

render() {

    return (
        <View style={styles.View}>

            <Text style={styles.textLabel}>The main view</Text>

        </View>
     )

   }

 }

 const styles = StyleSheet.create({

 View: {
    padding: 20
 },
 textLabel: {
    fontSize: 20,
    marginBottom: 10,
    height: 20
 },
 textInput: {
    height: 20,
    fontSize: 15,
    marginBottom: 20
  }

});

AppRegistry.registerComponent('MainList', ()=> MainList);

import-React{
组成部分
}从"反应",；
从“react native”导入{AppRegistry，View，StyleSheet，Text}；
从“react native router flux”导入{Actions}；
从“react native Firestack”导入Firestack；
const firestack=新的firestack（）；
界面道具{
}
界面状态{
isLoggedIn？：布尔值；
}
导出默认类MainList扩展组件{
状态={
伊斯洛格丁：错，
};
构造器（道具：任何）{
超级（道具）；
log（“有人登录吗？：”+this.isLoggedIn）；
}
isLoggedIn=this.state.isLoggedIn；
componentDidMount（）{
如果（！this.isLoggedIn）{
欢迎你；
}
firestack.auth.listenForAuth（函数（evt:any）{
//evt是身份验证事件
//它包含一个“error”键，用于携带
//发生错误时的错误消息
//在成功身份验证后提供“用户”密钥
如果（！evt.authenticated）{
//出现错误或没有用户
//控制台错误（evt错误）；
this.setState（{isLoggedIn:false}）；
log（“isLoggedIn的状态为：“+this.isLoggedIn”）；
}否则{
//evt.user包含用户详细信息
console.log（'User details'，evt.User）；
this.setState（{isLoggedIn:true}）；
log（“isLoggedIn的状态为：“+this.isLoggedIn”）；
}
}); 
}
render（）{
返回(
主要观点
)
}
}
const styles=StyleSheet.create({
视图：{
填充：20
},
文本标签：{
尺寸：20，
marginBottom:10，
身高：20
},
文本输入：{
身高：20，
尺寸：15，
marginBottom:20
}
});
AppRegistry.registerComponent（'MainList'，（）=>MainList）；

---

这里缺少什么吗？

问题是因为在

listenForAuth

的回调函数中，

这个

不再引用

MainList

对象

尝试切换到箭头函数表达式，以解决此绑定问题：

firestack.auth.listenForAuth((evt: any) => {
  ...
});

---

如果您想了解更多有关箭头功能的信息，请参阅。

发布整个文件。你是如何申报你的班级的？看起来你非常想念你：-）我应该意识到这一点，但我忘了提到我有点新，但这对我帮助很大，尤其是最后的帮助参考！不客气！还有一些其他的解决方案（例如，

bind（this）

或

var-that=this；

），但我发现使用arrow函数（在ES6中引入）要容易得多；在类定义之外，如果我要这样做，我正在收集？您可以定义

var that=this

在

componentDidMount（）

函数中，然后可以在回调函数中使用

that.setState（）

。