handling text input react native class component

Solutions on MaxInterview for handling text input react native class component by the best coders in the world

showing results for - "handling text input react native class component"
Ivan
02 Jun 2020
1import React, { Component } from 'react';
2import { Text, TextInput, View } from 'react-native';
3
4export default class PizzaTranslator extends Component {
5  constructor(props) {
6    super(props);
7    this.state = {text: ''};
8  }
9
10  render() {
11    return (
12      <View style={{padding: 10}}>
13        <TextInput
14          style={{height: 40}}
15          placeholder="Type here to translate!"
16          onChangeText={(text) => this.setState({text})}
17          value={this.state.text}
18        />
19        <Text style={{padding: 10, fontSize: 42}}>
20          {this.state.text.split(' ').map((word) => word && 'asa').join(' ')}
21        </Text>
22      </View>
23    );
24  }
25}