TextInput

«Основной компонент, позволяющий пользователю вводить текст» — фундамент для ввода текста с клавиатуры.

Управляемый ввод с useState

import React, { useState } from 'react'
import { View, TextInput, Text } from 'react-native'

const SearchBar = () => {
  const [query, setQuery] = useState('')

  return (
    <View>
      <TextInput
        value={query}
        onChangeText={setQuery}
        placeholder="Поиск..."
        style={{
          borderWidth: 1,
          borderColor: '#ccc',
          padding: 8,
          borderRadius: 6
        }}
      />
      <Text>Ты написал: {query}</Text>
    </View>
  )
}

Важные свойства

• onChangeText — «функция, вызываемая каждый раз при изменении текста»
• onSubmitEditing — «функция, вызываемая при отправке текста»

<TextInput
  keyboardType="email-address"
  secureTextEntry={true}
  autoCapitalize="none"
  multiline={true}
  maxLength={100}
/>