O'Reilly logo

React and React Native - Second Edition by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Success confirmation

Let's start by implementing a modal view that's displayed as the result of the user successfully performing an action. Here's the Modal component, which is used to show the user a success confirmation:

import React from 'react';import PropTypes from 'prop-types';import { View, Text, Modal } from 'react-native';import styles from './styles';// Uses "<Modal>" to display the underlying view// on top of the current view. Properties passed to// this component are also passed to the modal.const ConfirmationModal = props => (  <Modal {...props}>    {/* Slightly confusing, but we need an inner and         an outer "<View>" to style the height of the         modal correctly. */}    <View style={styles.modalContainer}> <View style={styles.modalInner}> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required