react-native ios模擬器觸摸不起作用

我想寫我的第一反應原生應用程序。我似乎無法獲得「TouchableHighlight」的功能。我想我已經正確地包裝了文本，但在IOS模擬器中沒有任何反應。代碼編譯正確，模擬器啓動，但是，無論我點擊開始文本多少次都沒有任何反應。react-native ios模擬器觸摸不起作用

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


var StopWatch = React.createClass({ 
    render: function(){ 
    return <View style={styles.container}> 
    <View style={[styles.header, this.border('yellow')]}> 
    <View style={[styles.timerWrapper , this.border('red')]}> 
    <Text> 
     00:00:00 
    </Text> 
    </View> 
    <View style={[styles.buttonWrapper , this.border('green')]}> 
    {this.startStopButton()} 
    {this.lapButton()} 
    </View> 
    </View> 
     <View style={[styles.footer, this.border('blue')]}> 
     <Text> 
     I am a list of Laps 
     </Text> 
     </View> 

</View> 
    }, 

    startStopButton: function() { 
    return <TouchableHighlight underlayColor="gray" onPRess={this.handleStartPress}> 
     <Text> 
     Start 
     </Text> 
    </TouchableHighlight> 
    }, 

    lapButton: function() { 
    return <View> 
     <Text> 
     Lap 
     </Text> 
    </View> 
    }, 
    handleStartPress: function() { 
     console.log('Start was pressed'); 
    }, 
    border: function (color) { 
     return { 
      borderColor: color, 
      borderWidth: 4 
     } 

    } 
}); 

var styles = StyleSheet.create({ 
    container:{ 
     flex: 1, 
     alignItems: 'stretch' 
    }, 
    header: { 
     flex: 1 
    }, 
    footer: { 
     flex: 1 
    }, 
    timerWrapper: { 
     flex: 5, 
     justifyContent: 'center', 
     alignItems: 'center' 
    }, 
    buttonWrapper: { 
     flex: 3, 
     flexDirection: 'row', 
     justifyContent: 'space-around', 
     alignItems: 'center' 

    } 

}); 


AppRegistry.registerComponent('stopwatch',() => StopWatch);

來源

2016-12-30 neatoh80

試試這個。在onPress

startStopButton: function() { 
    return <TouchableHighlight underlayColor="gray" onPress={this.handleStartPress}> 
     <Text> 
     Start 
     </Text> 
    </TouchableHighlight> 
    },

來源

2016-12-30 06:29:13

@ neatoh80歡迎

錯字錯誤..........！ –

react-native ios模擬器觸摸不起作用

回答

相關問題