Question

我尝试了多种实现，但似乎无法使状态变得不确定。我已经尝试过箭头功能，已经尝试将其绑定到onChange事件中，但似乎没有任何效果。有人可以接受我的代码库，让我对我做错的事情有所了解吗？谢谢！

import React from 'react';
import {View, Image, StyleSheet} from 'react-native';
import {Button, Text, Input} from 'react-native-elements';
import Icon from 'react-native-vector-icons/FontAwesome';

const styles = StyleSheet.create({
    heading: {
        padding: 20,
    },
});

export default class ContactForm extends React.Component
{
    constructor(props) 
    {
        super(props);

        this.state = {
            name: '',
            email: '',
        }
    }

    handleName(e)
    {
        this.setState({name: e.target.value})
        console.log(e.target.value);
    }

    handleEmail(e)
    {
        
    }

    submit(e)
    {
        console.log(this.state.name + " " + this.state.email);
    }

    render() 
    {
    return (
    <View style={styles.heading}>
        <Text h5>Sign up to receive updates/newsletters!</Text>
        <Input placeholder="your name" onChange={this.handleName.bind(this)} />
        <Input placeholder="your email" onChange={this.handleEmail.bind(this)} />
        <Button title="Submit" onPress={this.submit}/>
    </View>
    )
    }
}

Answer 1

嗨，您可以这样操作，无需将箭头功能与“ this”绑定。

export default class ContactForm extends React.Component
{
    constructor(props) 
    {
        super(props);

        this.state = {
            name: '',
            email: '',
        }
    }

    handleName=(e)=>
    {   console.log(e);
        this.setState({name: e})
        
    }

    handleEmail=(e)=>
    {
        this.setState({email: e})
    }

    submit=()=>
    {
        console.log(this.state.name + " " + this.state.email);
    }

    render() 
    {
    return (
    <View style={styles.heading}>
        <Text h5>Sign up to receive updates/newsletters!</Text>
        <Input placeholder="your name" onChangeText ={this.handleName} /> 
        //change onChange to onChangeText 
        <Input placeholder="your email" onChangeText={this.handleEmail} />
        <Button title="Submit" onPress={this.submit}/>
    </View>
    )
    }
}

反应未定义的本机Firebase状态

1 个答案: