I am trying to create a simple app with a button in react native, but so far every time I run my code, it gives me an error saying "Can't find variable: Button". I would like to end up with my title at the top (Already done) and a button in the center of the screen, which gives an alert when touched.
I have run through several online tutorials and cannot find a solution.
Here is my code:
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
class Project extends Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.Title}>
Lucas's App
</Text>
<View style={styles.buttonContainer}>
<Button
onPress={() => { Alert.alert('You tapped the button!')}}
title="Press Me"
/>
</View>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#F5FCFF',
},
Title: {
color: '#000000',
marginTop: 13,
paddingLeft:100,
paddingRight:100,
fontFamily: 'Avenir',
fontSize: 30,
},
buttonContainer: {
margin: 20
},
});
AppRegistry.registerComponent('Project', () => Project);
Thanks in advance.
You need to make sure to import the button. You can do this by adding this before your code:
import {
AppRegistry,
StyleSheet,
Text,
View,
Button,
Alert
} from 'react-native';
[Or just add button to the import list]
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.