Hands-On Design Patterns with React Native

The TextInput component

We will use this component often in the next section. The general idea is to be able to pass data from a smartphone keyboard. TextInput is used in login and registration forms and many other places where the user needs to send text data to an application.

Let's extend the HelloWorld example from Chapter 1, React Component Patterns, to accept a name:

// Chapter 2 / Example 6 / src / TextInputExample.jsexport default class TextInputExample extends React.Component {    state = {        name: null    };    render = () => (        <View style={styles.container}>            {this.state.name && (                <Text style={styles.text}>                    Hello {this.state.name}                </Text>            )}            <Text>Hands-On Design Patterns with React Native</Text>            <Text>Chapter 2: View Patterns</Text> <Text ...