錯誤：未定義不是函數 - 反應原生

Question

我創建了一個簡單的活動，如果你在圓形區域內按下，其中的文本應該相應地改變。該應用程序運行良好，但當我在圓形區域內按下時，出現錯誤提示「未定義不是函數（評估'this.setState（{pressed：true}）;'）」。 此外，圓形區域內的文本應該初始設置，但它是空的。 你可以看到活動here。代碼也提供如下：

import React, { Component } from "react"; 
import { 
    StyleSheet, 
    View, 
    AppRegistry, 
    Text, 
    TouchableHighlight 
} from "react-native"; 

class dhrumil extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { pressing: false }; 
    } 
    _inPress() { 
    this.setState({ pressing: true }); 
    } 
    _outPress() { 
    this.setState({ pressing: false }); 
    } 
    render() { 
    return (
     <View style={styles.mainContainer}> 
     <TouchableHighlight 
      onPressIn={this._inPress} 
      onPressOut={this._outPress} 
      style={styles.toucher} 
     > 
      <View style={styles.smallContainer}> 
      <Text style={styles.texter}> 
       {this.state.pressing ? "EEK" : "PUSH ME"} 
      </Text> 
      </View> 
     </TouchableHighlight> 
     </View> 
    ); 
    } 
} 
var styles = StyleSheet.create({ 
    mainContainer: { 
    flex: 1, 
    backgroundColor: "white", 
    justifyContent: "center", 
    margin: 10, 
    alignItems: "center" 
    }, 
    toucher: { 
    borderRadius: 100 
    }, 
    smallContainer: { 
    backgroundColor: "#ff0000", 
    width: 200, 
    height: 200, 
    borderRadius: 100 
    }, 
    texter: { 
    color: "white", 
    fontSize: 10, 
    fontWeight: "bold" 
    } 
}); 

AppRegistry.registerComponent("dhrumil",() => dhrumil); 

我該如何解決這個問題？

Answer 1

問題就在這裏：

<TouchableHighlight onPressIn={this._inPress} 
onPressOut={this._outPress} style={styles.toucher}> 

您沒有固定的背景下作爲當前this設置處理程序。 所以當函數被調用時setState沒有找到，因爲this會有所不同。使用bind。

<TouchableHighlight onPressIn={this._inPress.bind(this)} 
    onPressOut={this._outPress.bind(this)} style={styles.toucher}> 

或者你也可以使用箭頭功能：

<TouchableHighlight onPressIn={() => this._inPress()} 
     onPressOut={() => this._outPress()} style={styles.toucher}>