React Nativeは電話で空白の画面を表示します

Question

時間を検索した後、私はついに失われました。私は、反応のネイティブのための古いチュートリアル（https://code.tutsplus.com/tutorials/creating-a-dictionary-app-using-react-native-for-android--cms-24969）の後に簡単な辞書アプリを構築しようとしました。私は "反応ネイティブのinit"を実行した後の標準的なアプリケーションは、私の携帯電話で正常に動作します。しかし、私のコードは何のエラーもなく空白の画面を表示します。以下は、私がindex.adroid.jsのすべてを置き換えるために使用したコードを掲載したものです。もし私がここで私を助けることができたら、本当に感謝しています。前もって感謝します！

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

var english_german = require('./english_german.json'); 

class Dictionary extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
      input: '', 
      output: '' 
     }; 
    } 

    render() { 
     return(
      <View style={styles.parent}> 
       <Text> 
       Type something in English: 
       </Text> 

       <TextInput 
        // style= {{height: 40}} 
        // placeholder="Type here to translate!" 
        onChangeText={(text) => this._onTextInputChangeText(text)} 
        value={this.state.input} 
        onSubmitEditing={ this.showTranslation().bind(this)} /> 

       <Text style = {styles.germanLabel}> 
       German translation: 
       </Text> 

       <Text style = {styles.germanWord}> 
        {this.state.output} 
       </Text> 
      </View> 
     ); 
    } 

    _onTextInputChangeText(text) { 
     //alert(text); 
     this.setState({ 
      input : text 
     }) 
    } 

    showTranslation() { 
     var translation = this.state.input in english_german ? english_german[this.state.input] : "Not found"; 

     this.setState({ 
      output: translation 
     }); 
    } 
} 



const styles = StyleSheet.create({ 

    // For the container View 
    parent: { 
     padding: 16 
    }, 

    // For the Text label 
    germanLabel: { 
     marginTop: 20, 
     fontWeight: 'bold' 
    }, 

    // For the Text translation 
    germanWord: { 
     marginTop: 15, 
     fontSize: 30, 
     fontStyle: 'italic' 
    } 
}); 

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

Answer 1

ありがとう！

ほとんどの場合エラーは発生しませんでしたが、構文エラーがonSubmitEditingにありました。何らかの理由で、TextInput全体のコメントを外しても機能しませんでした（何かを表示する）。とにかくonSubmitEditing={ this.showTranslation.bind(this)}へのMichael Chengの修正が働いた。