React Native undefined 不是一个对象（评估'this.onPressButton.bind'）

Question

所以“onPress={this.onPressButton.bind(this)}”导致我的应用程序失败？

我能做些什么来解决它。我相信它与（这个）变得不受约束或什么有关？

我正在渲染一个名为 Login 的组件：

export default class Login extends Component {

constructor(props) {
    super(props);
    this.state = {
        id:'login'
    }
}

render() {
    return(
        <KeyboardAvoidingView behavior="padding" style={style.container}>
            <View style={style.logoContainer}>
                <StatusBar barStyle="light-content" />
                <Image style={style.logo} source={require('../../image/Octocat.png')} />
                <Text style={style.logoText}> A Github app using React Native by{"\n"} Thomas Charlesworth</Text>
            </View>
            <View style={style.formContainer}>
                <LoginForm />
            </View>
        </KeyboardAvoidingView>
    );
}
}

还有一个登录表单组件：

export default class LoginForm extends Component {

onPressButton(){
    this.props.navigator.push({
        id: 'splash',
        passProps: {
        // Your Props
        }
    })
}

render() {
    return(
        <View style={style.container}>
            <TextInput 
                style={style.input} 
                placeholder="Username" 
                placeholderTextColor="rgba(255,255,255,0.5)"
                returnKeyType="next"
                autoCapitalize="none"
                autoCorrect={false}
                onSubmitEditing={()=> this.passwordInput.focus()}
            />
            <TextInput 
                style={style.input} 
                secureTextEntry 
                placeholder="Password" 
                placeholderTextColor="rgba(255,255,255,0.5)"
                returnKeyType="go"
                ref={(input) => this.passwordInput = input}
            />
            <TouchableOpacity 
                style={style.buttonContainer}
                onPress={this.onPressButton.bind(this)}
            > 
                <Text style={style.buttonText}>
                    LOGIN
                </Text>
            </TouchableOpacity>
        </View>
    );
}
}

Answer 1

这样写：

从父组件传递一个函数：

<LoginForm update={this.update.bind(this)}>

navigate(data){
    this.props.navigator.push({data});
}

在子组件中：

onPressButton(){
    let data = {
        /*data*/
    }
    this.props.navigate(data);
}