Alert Example In React Native

React Native

Nicesnippets

64

23-06-2020


Hi Guys,

In this example,I will learn you how to use alert message in react native.you can easy use alert message in react message.

Tapping any button will fire the respective onPress callback and dismiss the alert. By default, the only button will be an 'OK' button.

Step 1 - Create project

In first step,you can install new project.So run bellow command and get clean fresh react native project.

expo init ScrollView

Step 2 - App.js

In this step, You will open App.js file and put the code.

import React from 'react'

import { Alert, Text, TouchableOpacity, StyleSheet } from 'react-native'

const AlertExample = () => {

const showAlert = () => {

Alert.alert(

'This is alert example...'

)

}

return (

<TouchableOpacity onPress = {showAlert} style = {styles.button}>

<Text style = {styles.text}>Alert</Text>

</TouchableOpacity>

)

}

export default AlertExample

const styles = StyleSheet.create ({

button: {

backgroundColor: '#5f9ea0',

padding: 15,

width : 150,

alignItems: 'center',

marginTop: 100,

marginLeft: 100,

color: '#fff',

fontSize : 15

},

text: {

color: '#fff'

}

})

Step 3 - Run project

In the last step run your project using bellow command.

npm start

Output :

It will help you...