我对React native很陌生,最近一直在摆弄它。每次我使用其中一个可触摸组件时都会遇到问题。由于某种原因,当我点击可触摸组件时,它没有响应。我尝试寻找其他解决方案,但没有找到。(如果你需要知道的话,我也在使用Expo)
import {
ImageBackground,
StyleSheet,
View,
SafeAreaView,
Platform,
StatusBar,
Text,
TouchableOpacity,
} from "react-native";
const StartScreen = () => {
return (
<ImageBackground
source={require("../assets/Background.png")}
style={{ flex: 1 }}
>
<SafeAreaView style={styles.ContentArea}>
<TouchableOpacity onPress={console.log("Button pressed!")}>
<View style={styles.nextButton}>
<Text style={{ fontWeight: "bold", fontSize: 15 }}>Test</Text>
</View>
</TouchableOpacity>
</SafeAreaView>
</ImageBackground>
);
};
const styles = StyleSheet.create({
ContentArea: {
flex: 1,
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
justifyContent: "flex-end",
alignItems: "center",
},
nextButton: {
width: 150,
height: 40,
backgroundColor: "tomato",
marginBottom: 45,
alignItems: "center",
justifyContent: "center",
borderRadius: 50,
},
});
export default StartScreen;
1条答案
按热度按时间oaxa6hgo1#
你在
onPress
方法中传递了一个函数调用。这使得console.log在render上运行。console.log()
返回undefined,所以你的onPress
属性最终是undefined
本身。你要做的是传递一个对函数的引用,或者是一个匿名函数。下面是一个例子: