2016-11-10 1 views
3

나는 원주민에 반응하고 js에 익숙하지 않다.버튼을 눌렀을 때 상태를 변경하는 방법은 무엇입니까?

Button (Text : Button 아래에 있음)을 눌렀을 때 TextInput에 내가 쓴 것을 프로그램에 표시하고 싶습니다. 나는 2 가지 상태를 만들어야한다고 생각했다 : Text 입력으로 상태 1을 입력하고 을 TextInput 입력으로 놓고 pressed 버튼을 누르면 상태 1 text에 상태 2 mimin을 넣는다.

아래 코드로 시도했지만 Button을 클릭하면 빨간색 페이지가 나타납니다.

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    Button, 
    TextInput, 
    Alert, 
    View 
} from 'react-native'; 

export default class Hella extends Component { 

constructor(props) { 
    super(props); 
    this.state = {text: '', mimin: ''}; 
} 

render() { 
    return (
     <View style={styles.container}> 

     <TextInput 
      style={{height: 40}} 
      placeholder="Type here to translate!" 
      onChangeText={(mimin) => this.setState({mimin})} 
     /> 
     <Button 
      onPress={onButtonPress} 
      title="Learn More" 
      color="#841584" 
      accessibilityLabel="Learn more about this purple button" 
     /> 
     <Text style={styles.instructions}> 
      {this.state.text} 
     </Text> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    backgroundColor: '#F5FCFF', 
    } 
}); 

const onButtonPress =() => { 
    Hella.setState({ 
     text: Hella.state.mimin -------> where the error happened 
    }); 
}; 

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

오류는 내가 잘못 했습니까 무엇

undefined is not an object (evaluating 'Hella.state.mimin') 

onButtonPress 
<project location>/index.android.js:61 

입니까? 어떻게 선언해야합니까? 어디에서 더 배울 수 있습니까? 당신이 setState

export default class Hella extends Component { 
    constructor(props) { 
    ... 
    } 

    onButtonPress =() => { 
    this.setState({ 
     text: this.state.mimin 
    }); 
    } 

    render() { 
    return (
     ... 
     <Button 
     onPress={this.onButtonPress} 
     ... 
     /> 
     ... 
    ); 
    } 
} 

가 기본이 개념 반응을 많이 사용 반작용하고 싶어하기 때문에

답변

관련 문제