1.

How is user Input Handled in React Native ?

Answer»

TextInput is a Core Component that allows the user to enter text. It has an onChangeText prop that takes a function to be called every TIME the text CHANGES, and an onSubmitEditing prop that takes a function to be called when the text is submitted.

import REACT, { useState } from 'react';import { Text, TextInput, View } from 'react-native';const PizzaTranslator = () => { const [text, setText] = useState(''); return ( <View STYLE={{padding: 10}}> <TextInput style={{height: 40}} placeholder="Type here to TRANSLATE!" onChangeText={text => setText(text)} defaultValue={text} /> <Text style={{padding: 10, fontSize: 42}}> {text.split(' ').map((word) => word && '🍕').join(' ')} </Text> </View> );}export default PizzaTranslator;


Discussion

No Comment Found