Undefined не является объектом (оценка 'state.input')

Question

Я пытаюсь прочитать ключ из json-файла и отобразить его значение в текстовом поле. Пользователь вводит значение ключа в поле TextInput. Ниже приведен код, который я использую. Он выбрасывает «Undefined - это не объект (оценка« this.state.input »)« ошибка после ввода текста и нажатия кнопки отправки. Я думаю, что есть некоторая проблема в привязке/передаче значения функции showMeaning(). Пожалуйста помоги.

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

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

    showMeaning() { 
    var meaning = this.state.input in english_german ? english_german[this.state.input] : "Not Found"; 
    this.setState({ 
     output: meaning 
    }); 
    } 

    render() { 
    return (
     <View style={styles.parent}> 
     <Text> 
      Type something in English: 
     </Text> 
     <TextInput value={this.state.input} 
      onChangeText={(input) => this.setState({ input }) } 
      onSubmitEditing = {this.showMeaning} 
      /> 
     <Text style={styles.germanLabel}> 
      Its German equivalent is: 
     </Text> 
     <Text style={styles.germanWord}> 
      {this.state.output} 
     </Text> 
     </View> 
    ); 
    } 
}; 

var styles = StyleSheet.create({ 
    parent: { 
    padding: 16 
    }, 
    germanLabel: { 
    marginTop: 20, 
    fontWeight: 'bold' 
    }, 
    germanWord: { 
    marginTop: 15, 
    fontSize: 30, 
    fontStyle: 'italic' 
    } 
}); 

AppRegistry.registerComponent('Dictionary', function() { 
    return Dictionary; 
}) 

Answer 1

При вызове showMeaning он не обязан правильный контекст (this). Вы должны bind или использовать функцию стрелка, которая имеет лексическое this и т.д .:

onSubmitEditing = {() => this.showMeaning()} 

Answer 2

Как madox2 сказал showMeaning не правильно связан с this. Это сложная проблема с несколькими возможными решениями, плюсы и минусы которых перечислены в this medium post. Самый чистый, по моему мнению, вариант 5, но для этого требуется использование функций этапа 2.